Изменение свойств картинок в документе
Всем привет, передо мной такая задачка. Через админку на сайт с помощью визуального редактора добавляются документы, содержащие картинки. Требуется написать скрипт, который все картинки будет оснащать свойством "onclick", чтоб по щелчку открывался попапчик с большой картинкой. Жаваскрипт я знаю на поверхностном уровне, поэтому обращаюсь за помощью. Я много лазил по сети, нашел пару вариантов решений, но они не совсем подходят.
Если я правильно понимаю, сначала надо собрать все картинки, что есть в документе, вычислить для каждой ссылку на большую картинку (это я уже сделал), а затем добавить к ним свойство onclick. Посоветуйте, плз, как это можно сделать? |
так в чём у тебя затык? в назначении onclick?
пиши imgXXX.onclick = function() {вызываем большую картинку}; |
Затык в неполном понимании жаваскрипта)
То есть можно сделать так: 1. собрать в массив все картинки в документе. 2. Для каждой вызвать array[index].onclick = function () {http://big_image}; и это автоматом сделает все картинки кликабельными? И если так, то как их собрать в один массив? Может, коряво вопрос поставил, но в знании жаваскрипта есть пробелы, часть из которых я ликвидировал прочтением мануалов, но часть еще дает о себе знать) |
Цитата:
2) array[index].onclick = function () {this.src="http://big_image"}; |
Цитата:
в самый конец страниц добавил код: Код:
<script language="javascript"> |
imgList[index_a].onclick = function () {открываем попап с bigLink;};
Можешь поискать готовые скрипты для открытия попапа (их очень много), можешь сам написать по их примеру. |
Я сделал так:
imgList[index_a].onclick = function () {window.open(bigLink);}; Единственно, слишком большое окно открывается, а в Firefox - новая вкладка вместо попапчика. А можно как-нибудь открывать картинку без нового окна, чтоб она в этом же разворачивалась? |
Подниму снова эту тему.
Немного поменял условия задачи. Все практически то же самое, но я хочу при нажатии на картинку сделать не новый попап, а чтоб в этом же окне разворачивался див. Нечто подобное реализовано тут: http://www.felix-riesterer.de/main/seiten/js_popup.html Но здесь онкликом оснащаются не картинки (как хочу я), а ссылки, плюс там большой, сложный код, я хочу проще сделать. Итак, я в документе сделал <div id="divPopup"> прописал в css, чтоб он был hidden. В хедере написал функцию <script language="Javascript"> function showDiv () { var el = document.getElementById('divPopup'); el.style.visibility = 'visible'; } </script> а внизу страницы добавил код <script language="javascript"> var imgList = document.getElementsByTagName('img'); //список картинок for (var index_a = 0; index_a < imgList.length; index_a++) { imgList[index_a].onclick = showDiv()}; } </script> Пока этот кусок кода должен просто показывать див. Потом я вставлю в див код большой картинки. Но почему-то не работает. Страница сразу отображается с дивом, словно он визибл, а не хидден. Подскажите, почему так?? |
el.style.visibility = 'visible'
визибл резервирует место на странице. используй display="none"/"block" |
поменял, все осталось, как было...
Кстати, ИЕ выдает внизу слева желтый треугольничек об ошибке. ругается на последнюю строку: "imgList[index_a].onclick = showDiv();" говорит "not implemented |
Часовой пояс GMT +3, время: 13:24. |