asked on

add image within div

this is how I want it to appear in my view.

<span class="stack88">
<div class="stack" id="stack">
<img stack="true" src="ImgN/myimage.jpg">
</div></span>

Open in new window

also if I have multiply images then the div must stay the same
<span class="stack88">
<div class="stack" id="stack">
<img stack="true" src="ImgN/myimage.jpg">
<img stack="true" src="ImgN/myimage1.jpg">
<img stack="true" src="ImgN/myimage2.jpg">
</div></span>

 success: function (listItems) {
                            $.each(listItems, function () {
                            $(".stack88 img:last-child").remove()  // Remove last image before load.

                            $(".stack88").append($("<img>",
                            {
                                stack: "true",
                                src: "ImgN/" + this.myimage
                                
                            }));
                           
                        });

Open in new window

ASKER CERTIFIED SOLUTION

Chris Stanyon

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Seven price

ASKER

Its not going to work with that. Not for what I am trying to do. I need to to function the div then image then the closing div. any other ideas my friend.

Seven price

ASKER

Ok that will work.

Seven price

ASKER

Ok that will work but let me explain the big picture and maybe you can guide me to the correct path.

I am using a gallery. if the image is static it loads correctly. when the css loads when I try to dynamically load the image onclick I need to the image and the css to appear. I guess it does not load correctly using onclick only when it first loads to the DOM. Need a work around, what do you think.?

<div id="stack" class="stack" style="background-image: url("images/backtexture.png"); background-color: transparent; width: 900px; height: 900px; float: none;">
<img src="ImgN/myimage.jpg" stack="true" style="width: 600px; height: 750px; z-index: 0; left: 331.5px; top: 189px; border: 5px solid rgb(255, 255, 255); box-shadow: 0px 0px 5px rgb(85, 85, 85);">
<div id="stackstkzoom" class="zoom" style="background-image: url("images/slidrogallery/nav/small/zoom.png"); left: 884.933px; top: 202.433px; z-index: 500;"> </div>
<p id="stackstkcaption0" class="stkcaption" style="margin-top: 0px; left: 336.5px; top: 874px; width: 600px; height: 70px; z-index: 999; display: none;">
<div id="stackstkrightarrow" class="stkrightarrow" style="z-index: 1800; background-image: url("images/slidrogallery/nav/small/right.png"); left: 966.5px; top: 514px;"> </div>
<div id="stackstkleftarrow" class="stkleftarrow" style="z-index: 1800; background-image: url("images/slidrogallery/nav/small/left.png"); left: 246.5px; top: 514px;"> </div>
<div id="stackstkzoom" class="zoom"> </div>
<p id="stackstkcaption0" class="stkcaption">
<span style="color: rgb(255, 255, 255); font-size: 1em; left: 300px; top: 35px;"> </span>
</p>

Open in new window

Chris Stanyon

Sorry, you've lost me - can't really figure out what you're trying to do? Can you try and explain again what you need.

Seven price

ASKER

tks