fancybox problems...

[reiniger]

Sveicināti.

 

saskāros ar vienu problēmu kuru nevaru atrisināt.

index.php

<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
	$(document).ready(function() {

            <? for($i=1;$i<=$all_count;$i++): ?>            
		$("#var_gallery_<?=$i?>").fancybox({
			'width'			: '93',
			'height'			: '50',
			'autoScale'			: false,
			'transitionIn'		: 'none',
			'transitionOut'		: 'none',
			'type'				: 'iframe',
			'padding'			: '3',                
                               'overlayColor'              : '#000'
		});  
           <? endfor; ?> 

	});
</script>
       <script type="text/javascript">
       function nextGallery(IDvals, wayval){ 
            $('#gallery_slider').load('include/gallery.php',{nr: IDvals, way: wayval},
                   function(){
                        $('#gallery_slider').hide().fadeIn(200);
                   });     
         }  
</script>

...

<div id="gallery_slider" class="galerijas"></div>

...
<script type="text/javascript">
     $('#gallery_slider').load('include/gallery.php'); 
</script>

 

include/gallery.php - izdrukā man tikai 5 ierakstus ar LIMIT

....
 <li>
       <a id="var_gallery_<?=$sd?>" href="include/gallery_img.php?id_p=<?=$row['id']?>" >
       <img src="images/gallery/<?=$row['image'];?>" alt="" height="131" width="145" />
       </a>
 </li>
....

<a class="rightbtn_a" onclick="nextGallery('$_PAGE_TYPE','p');" ></a>

$sd viss man pareizi skaitas, lai neatkārtotos ID!

 

Kad atver index.php tad mans fancybox nostrādā, bet kad lieku jquery "nextGallery" ielādēt nākošos piecus, tad ielādejās un fancybox vairāk nenostrādā.

 

jau mēģināju iekš "include/gallery.php" pievienot kodu

<script type="text/javascript" src="../fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="../fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
	$(document).ready(function() {

            <? for($i=1;$i<=$all_count;$i++): ?>            
		$("#var_gallery_<?=$i?>").fancybox({
			'width'			: '93',
			'height'			: '50',
			'autoScale'			: false,
			'transitionIn'		: 'none',
			'transitionOut'		: 'none',
			'type'				: 'iframe',
			'padding'			: '3',                
                               'overlayColor'              : '#000'
		});  
           <? endfor; ?> 

	});
</script>
....
 <li>
       <a id="var_gallery_<?=$sd?>" href="include/gallery_img.php?id_p=<?=$row['id']?>" >
       <img src="images/gallery/<?=$row['image'];?>" alt="" height="131" width="145" />
       </a>
 </li>
....

tad vienalga nostrādā tikai uz pirmo ielādi. Mēģināju to fancybox JS iekopēt zem include mapes un no ceļa noņemt ../ tad vispār mans fancybox atteicās strādāt! Lietojot pilnu mājaslapas ceļu tas arī nestrādā!

 

Kas verētu būt par problēmu ka pēc atkārtotas jquery load() nestrādā fancybox?

Edited December 14, 2010 by reiniger

[indoom]

Uzliec tad to fancybox uz klasi, nevis id.

Pieliec tiem a class="fancybox" piem

un tad nevajag nekādu for ciklu, bet pietiek ar vienu $('.fancybox').fancybox({ .. });

Ja neko nejaucu, tad fancybox pirms katras atvēršanas refrešo listu, tad, arī ielādējot citu galeriju pēc fancybox() izsaukšanas, vajadzētu darboties.

[foxsk8]

Pirmais, uztaisi izvadu tā, lai tev visur ir klases

 

<div class="slider">
    <div class="prev"></div>
    <div class="pic">
      <ul>
        <li><a href="links" rel="gallery"><img src="bildes_src" alt="title" /></a></li>
        saliec vēl 4 gabalus
      </ul>
    </div>
    <div class="next"></div>
</div>

 

tālāk next 5 itemus var saveidot pavisam vienkārši ar kādu citu JS pluginu, piemēram, div pic klasē iemaucam 10 itemus, bet parādam 5, un tad ar next pogu, atkal paradīsim 5 itemus.

 

Un pašu fanciju piešķir šādi:

 

$(".pic a").fancybox();

 

Plus iekš pic a taga vari norādīt vēl rel=gallery, lai būtu galerijas kopa.

 

Slaideri, uz next 5 itemiem vari dabot šeit:

 

http://www.gmarwaha.com/jquery/jcarousellite/

 

$(".slider .pic").jCarouselLite({
	btnNext: ".slider .next",
	btnPrev: ".slider .prev",
	visible: 5,
	scroll: 1 // Scroll next 1 items
});

 

Beigās tas izskatītos šādi: