Note that there are some explanatory texts on larger screens.

plurals
  1. POZepto's clone() function not working properly or not possible to use clone() in combination with find()?
    text
    copied!<p>I have a simple image-slider, the html looks like this: </p> <pre><code>&lt;ul id="gallery-slider"&gt; &lt;li class="slide-li" &gt; &lt;img src="img1.png" width="1024" height="590" alt="img1"&gt; &lt;/li&gt; &lt;li class="slide-li" &gt; &lt;img src="img2.png" width="1024" height="590" alt="img2"&gt; &lt;/li&gt; &lt;li class="slide-li" &gt; &lt;img src="img3.png" width="1024" height="590" alt="img3"&gt; &lt;/li&gt; ... &lt;/ul&gt; </code></pre> <p>Now I want to add some thumbs to it to have an overview of the images. I want to create the thumbs from the images in the slides. I am using Zepto and tried the following to get the images and create new ones:</p> <pre><code>//imageSlider is the image slider instance in use for (var i = 1; i &lt;= imageSlider.length; i++) { //find the image in li var img = $('#gallery-slider li').eq(i-1).find('img').clone().attr({'width': 268, 'height': 172}); //view cloned element in console console.log(img); ... //here the img var will get pushed into an array } </code></pre> <p>Now when you spit out the img var in the console, it shows empty objects. I think the problem is the find() function, because when I do this: </p> <pre><code>var img = $('#gallery-slider li').eq(i-1).clone(); </code></pre> <p>the img var is not empty – the console output shows the cloned li elements. Is this a bug or can I not use the clone() function in combination with find() ?</p> <p><strong>Edit:</strong> </p> <p>I also tried this:</p> <pre><code>var img = $('#gallery-slider li').eq(i-1).find('img'), thumb = img.clone(); </code></pre> <p>– same result.</p>
 

Querying!

 
Guidance

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