Good day! Need a slider:

there are five blocks on the left, and there is a block with a picture on the right, and you need to make sure that when: hover on the left the corresponding img is displayed. Share the link or show an example plz.

  • I am not on friendly terms with jQuery mb who will show an example plz, urgently it is necessary. I will be grateful to everyone at least deep down) - Goldy

1 answer 1

jquery? www.jquery.org

script is something like

$(document).ready( function(){ $(".leftBlock").hover(function(){ $("#image").attr("src",$(this).attr("image_src"))}, function(){$("#image").attr("src","default_image_url");} });

left divs are made by the leftBlock class, and in the diva attribute image_src we write the url pictures for display in the div with id = "image"

 <html> <head> <script type = "text/javascript"> $(document).ready( function(){ $(".leftBlock").hover(function(){ $("#image").attr("src",$(this).attr("image_src"))}, function(){$("#image").attr("src","default_image_url");} }); </script> </head> <body> <div class="leftBlock" image_src="image1.jpg"> Left Block 1 </div> <div class="leftBlock" image_src="image2.jpg"> Left Block 2 </div> <div class="leftBlock" image_src="image3.jpg"> Left Block 3 </div> <div class="leftBlock" image_src="image4.jpg"> Left Block 4 </div> <div class="leftBlock" image_src="image5.jpg"> Left Block 5 </div> <div id="image_div" ><img id="image" src="default.jpg"/></div> </body> </html>
  • need to connect <script src = "jquery.js" type = "text / javascript"> </ script>? - Goldy
  • I fixed everything, you just have LeftBlock there and your div id is LeftBody. Thanks helped !. - Goldy
  • Yes, thanks, corrected - Chad
  • yes jquery must of course be connected - Chad
  • Everything did, it works, thanks again! - Goldy