I have a function called several li elements when you scroll down to the page function to a class Removes and creates an image element based on the data-attribution of each Lee:
function createImg (param) {var img = $ ('& lt; img & gt;') ; Img.attr ('src', $ (this) .attr ("data-src")); Img.appendTo (this); } $ (Window) .scroll (function () {if ($ (window) .scrollTop () + $ (window) .height () === $ (document) .height ()) {$ ("li.hidden "). Slice (0, 2) .removeClass ('hidden'). Each (createImg);}); & Lt; Ul & gt; & Lt; Li class = "hidden" data- src = "img / 1.jpg" & gt; & Lt; P & gt; 1 & lt; / P & gt; & Lt; / Li & gt; & Lt; Li class = "hidden" data- src = "img / 2.jpg" & gt; & Lt; P & gt; 2 & lt; / P & gt; & Lt; / Li & gt; & Lt; Li class = "hidden" data- src = "img / 3.jpg" & gt; & Lt; Div class = "image-cont" & gt; & Lt; / Div & gt; & Lt; P & gt; 3 & lt; / P & gt; & Lt; / Li & gt; & Lt; / Ul & gt;
However, now I want to create an image within div.image-cont within Lee. Ive tried javascript below, but it creates multiple pictures in each div.image-cont, instead of just 1 in each:
function createmg (param) {var img = $ ( '& Lt; img & gt;'); Img.attr ('src', $ (this) .attr ("data-src")); Img.appendTo ("image-per-message", this); } & Lt; Ul & gt; & Lt; Li class = "hidden" data- src = "img / 1.jpg" & gt; & Lt; Div class = "image-cont" & gt; & Lt; / Div & gt; & Lt; P & gt; 1 & lt; / P & gt; & Lt; / Li & gt; & Lt; Li class = "hidden" data- src = "img / 2.jpg" & gt; & Lt; Div class = "image-cont" & gt; & Lt; / Div & gt; & Lt; P & gt; 2 & lt; / P & gt; & Lt; / Li & gt; & Lt; Li class = "hidden" data- src = "img / 3.jpg" & gt; & Lt; Div class = "image-cont" & gt; & Lt; / Div & gt; & Lt; P & gt; 3 & lt; / P & gt; & Lt; / Li & gt; & Lt; / Ul & gt;
function createImg (param) {var img = $ ('& lt ; Img & gt; '); Img.attr ('src', $ (this) .attr ("data-src")); //img.appendTo(".image-cont ", this); $ (". Image-per", this) .append (img); }
Use attachment instead of attachment to resolve it.
No comments:
Post a Comment