CODEWITHSUNDEEP
javascriptjquery
Krish
Krish

Reputation: 2670

Prevent jquery slider's image show in the page on click

i am using this jquery and html for change the clicked image on a display div it works fine but the issue is when i click a image in the display div its open in the page itself. How to Make the image as it as when user click on it.

               <script type="text/javascript">
                   jQuery('div#thumbs img').click(function () {

                jQuery('#foo a').prop('href', jQuery(this).prop('src'));
                jQuery('#foo img').prop('src', jQuery(this).prop('src'));
                return false;
              })
              </script>

my html

          <div id="foo">
        <a href="#">
         <img src="images/demo_slider.jpg" name="Display" id="display" /></a>
            </div>
             <br />
            <div id="thumbs">
       <img src="images/a.jpg" width="56" height="56" alt="" />
       <img src="images/b.jpg" width="56" height="56" alt="" />
       <img src="images/c.jpg" width="56" height="56" alt="" />
      <img src="images/d.jpg" width="56" height="56" alt="" />
         </div>

       </div>

edit:

If the user click the thumbs image it load to the div foo. then the user click the image in foo the clicked image opens in the same page(as the basic html functionality like open image in new tab) i need to prevent the image open on click.

Upvotes: 1

Views: 571

Answers (2)

Nicola Peluchetti
Nicola Peluchetti

Reputation: 76880

You should do

$('#foo a').click(function(e){
  e.preventDefault();
});

Upvotes: 1

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100195

Not tested, but you could try adding preventDefault:


jQuery("#foo a").click(function(e) {
   e.preventDefault();
});

Did you mean something like that...

Upvotes: 1

Related Questions