Изменение фона элементов списка по щелчку мыши_проблема!
Скажу честно, в JS пока очень слаб, но было очень нужно и нарыл таки в инете скрипт с помощью которого, при клике на данном элементе списка, в отдельном окне, выводится нужное изображение патента. Однако, помимо этого, крайне необходимо, чтоб после клика мышью, происходило выделение (например - голубым) фоном того элемента списка на котором был сделан клик, а с предыдущего элемента списка выделение исчезало. Очевидно, что данный скрипт, после очередного клика/щелчка, выделение (фон) на новую строку не переместит и с предыдущей строки фон так же не удалит.
Вот скрипт: <script language="JavaScript" type="text/javascript"> function l_image (a) { document.example_img.src=a; } </script> <body> ...... <div id="imagebody"> <ul> <li><a href="javascript:l_image ('patents/2256.jpg');" onclick="this.style.backgroundColor='blue';">1. Patent #2347 A, UI20090059, 2012.</a></li> <li><a href="javascript:l_image ('patents/2311.jpg')">2. Patent #2343 A, UI20090061, 2011.</a></li> <li><a href="javascript:l_image ('patents/2318.jpg')">3. Patent #2318 A, UI20090060, 2010.</a></li> </ul> </div> ........ <div id="winwrapper"> <div id="imagewrapper"><img src="patents/2256.jpg" width="302" name="example_img" alt="image" /> </div> </div> .......... </body> Товарищи спецы в этом деле! Помогите пожалуйста привести скрипт в соответствие с требованиями, описанными выше!! |
Boris777,
<script>
window.onload = function () {
document.getElementById("imagebody").onclick = function (e) {
e = e || event;
target = e.target || e.srcElement;
imgs = document.getElementById("imagebody").getElementsByTagName("a");
if (target.tagName == "A") {
for (i = 0; i < imgs.length; i++) {
imgs[i].style.backgroundColor = "white";
}
target.style.backgroundColor = "blue";
document.example_img.src = "patents/"+target.href.split("#")[1]+".jpg";
}
}
}
</script>
<body>
......
<div id="imagebody">
<ul>
<li><a href="#2256">1. Patent #2347 A, UI20090059, 2012.</a></li>
<li><a href="#2311">2. Patent #2343 A, UI20090061, 2011.</a></li>
<li><a href="#2318">3. Patent #2318 A, UI20090060, 2010.</a></li>
</ul>
</div>
........
<div id="winwrapper">
<div id="imagewrapper"><img src="patents/2256.jpg" width="302" name="example_img" alt="image" />
</div>
</div>
..........
</body>
|
| Часовой пояс GMT +3, время: 11:56. |