Смена картинки при нажатии на маленькие картинки
Здравствуйте! Подскажите, пожалуйста, как лучше сделать.
На странице есть несколько отдельных блоков, в каждом из них несколько картинок-превью, при нажатии на которые отображаются большие картинки без перезагрузки страницы. Т.е. в каждом блоке меняются большие картинки при нажатии на превью. Для одного блока я использовала вот такую конструкцию: <script language='javascript'> function show(path) { if (obj = document.getElementById('pic')) {obj.src = path; } } </script> <img id="pic" src = "images/big_1.jpg"> <a href="#f" onClick="show('images/big_1.jpg'); return false;"><img src="images/small_1.jpg"></a> <a href="#f" onClick="show('images/big_2.jpg'); return false;"><img src="images/small_2.jpg"></a> Как сделать, чтобы все работало для нескольких блоков? <img id="pic2" src = "images/big_3.jpg"> <a href="#vf" onClick="show('images/big_3.jpg'); return false;"><img src="images/small_3.jpg"></a> <a href="#vf" onClick="show('images/big_4.jpg'); return false;"><img src="images/small_4.jpg"></a> и т.д. |
comb,
show(path, id) |
Спасибо за ответ, но т.к. в скрипте я указала getElementById('pic'), как привязать скрипт ко всем блокам (с разными id pic, pic2 и т.д.)?
Простите, в javascript разбираюсь плохо. |
comb,
function show(path,id) { if (obj = document.getElementById(id)) {obj.src = path; } } show('images/big_3.jpg','pic2'); |
Спасибо вам огромное, все работает!!!
|
Часовой пояс GMT +3, время: 08:13. |