change image with click on tabs or thumbnails using jQuery
HTML CODE
<table border="1" > <tr> <td colspan="3"><div id="thumb"><img src='Default-Image.jpg' height='200px' widht='200px' ></div> </td> </tr> <tr> <td> <div id="one"><img src='img-thum1.jpg' height='50px' widht='50px' ></div> </td> <td> <div id="two"><img src='img-thum2.jpg' height='50px' widht='50px' ></div> </td> <td> <div id="three"><img src='img-thum3.jpg' height='50px' widht='50px' ></div> </td> </tr> </table>jQuery CODE
<script src="http://code.jquery.com/jquery-latest.js"></script> <script> $("#one").click(function() { $("#thumb").html("<img src='Big-Image1.jpg' height='200px' widht='200px' >"); }); $("#two").click(function() { $("#thumb").html("<img src='Big-Image1.jpg' height='200px' widht='200px' >"); }); $("#three").click(function() { $("#thumb").html("<img src='Big-Image1.jpg' height='200px' widht='200px' >"); }); </script>
0 comments :
Feel free to leave comment if you like above widget, have any questions or just say Hi! :)