Databases
StackOverflow2013
Postsdbo
POJquery images slide show does not start from beginning
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJquery images slide show does not start from beginning
    text
    copied!<p>I'm new to Jquery and Javascript. I have used the below code to display the images in a lightbox</p> <pre><code>&lt;script type="text/javascript" src="&lt;?php echo Yii::app()-&gt;theme-&gt;baseUrl; ?&gt;/js/jquery.lightbox-0.5.js"&gt;&lt;/script&gt; &lt;link rel="stylesheet" type="text/css" href="&lt;?php echo Yii::app()-&gt;theme-&gt;baseUrl; ?&gt;/css/jquery.lightbox-0.5.css" media="screen" /&gt; &lt;script type="text/javascript"&gt; $(function() { $('#album1 a').lightBox(); $('#album2 a').lightBox(); }); &lt;/script&gt; </code></pre> <p>Below is the PHP code to display the images using the above script. </p> <pre><code> &lt;div class="image-zoom" rel="lightbox" id="gallery"&gt; &lt;div id="album1" style="margin-right:18px;" rel="lightbox"&gt; &lt;?php if (isset($albums[0])) { $i = 1; foreach ($albums[0]['photos'] as $photo) { if ($i == 1) { ?&gt; &lt;a href="&lt;?= $photo ?&gt;" rel="lightbox"&gt; &lt;img src="&lt;?= $photo ?&gt;" width="214" height="160" /&gt; &lt;/a&gt; &lt;?php } else { ?&gt; &lt;a href="&lt;?= $photo ?&gt;" rel="lightbox"&gt;&lt;/a&gt; &lt;?php } $i++; } ?&gt; &lt;div class="zoom-magnifier" id="gallery"&gt; &lt;a href="&lt;?= $photo ?&gt;" rel="lightbox"&gt; &lt;img src="&lt;?php echo Yii::app()-&gt;theme-&gt;baseUrl; ?&gt;/images/zoom-icon.png" id="zoom"/&gt; &lt;/a&gt; &lt;div id="more-text" align="left" &gt;&lt;?=$albums[0]['title']?&gt;&lt;/div&gt; &lt;/div&gt; &lt;?php } ?&gt; &lt;/div&gt; &lt;div id="album2" rel="lightbox"&gt; &lt;?php foreach (array(1, 0) as $album_id) { if (isset($albums[$album_id])) { $i = 1; foreach ($albums[$album_id]['photos'] as $photo) { if ($i == 1) { ?&gt; &lt;a href="&lt;?= $photo ?&gt;" rel="lightbox"&gt; &lt;img src="&lt;?= $photo ?&gt;" width="214" height="160" /&gt; &lt;/a&gt; &lt;?php } else { ?&gt; &lt;a href="&lt;?= $photo ?&gt;" rel="lightbox"&gt;&lt;/a&gt; &lt;?php } $i++; } ?&gt; &lt;div class="zoom-magnifier"&gt; &lt;a href="&lt;?= $photo ?&gt;" rel="lightbox"&gt; &lt;img src="&lt;?php echo Yii::app()-&gt;theme-&gt;baseUrl; ?&gt;/images/zoom-icon.png" id="zoom1"/&gt; &lt;/a&gt; &lt;div id="more-text2" class="more-txt-link"&gt;&lt;?=$albums[$album_id]['title']?&gt;&lt;/div&gt; &lt;/div&gt; &lt;?php break; } } ?&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>This generates a magnifier image inside an image. When I click on the image, lightbox slides the images from 1 to 6. But when I click on the magnifier(zoom-icon.png). the lightbox starts sliding from last but one image. How to make it start from image 1.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload