Простейший двухстрочны скрипт. Нужна помошь.
Здравствуйте.
Я не кодер, поэтому не бейте палками. Задача такая — есть хтмл-код <img id="img1" srс="/images/img1.jpg" alt=""/> <a onmouseover="imgOn ('/images/img2.jpg')" href="">Картинка2</a> <a onmouseover="imgOn ('/images/img3.jpg')" href="">Картинка3</a> <a onmouseover="imgOn ('/images/img4.jpg')" href="">Картинка4</a> Потерялась функция imgOn, которая "вставляла" в src для img id="img1" соответствующую картинку при наведении на ссылку. Помогите ее написать. |
var imgOn = function(img){ return function(src){ img.src = src; }; }( document.getElementById( "img1" ) ); |
Вставил код в хтмл-страницу, желаемого результата почему-то нет, картинка не меняется...
<script type="text/javascript"> var imgOn = function(img){ return function(src){ img.src = src; }; }( document.getElementById( "img1" ) ); </script> |
Вот вам по простому:
<script type='text/javascript'> pic = new Image(); pic.src="http://img81.imageshack.us/img125/1945/hay21yz1.gif"; pic.src="http://photos3.fotosearch.com/bthumb/CSP/CSP254/k2540937.jpg"; pic.src="http://img-fotki.yandex.ru/get/4512/svetlera.44/0_50908_410dc7a8_S.jpg"; function imgOn (img) { document.getElementById("img1").src = img; } </script> <div style="height:150px"> <img id="img1" src="http://img-fotki.yandex.ru/get/5503/svetlera.1b3/0_57c30_ca388126_S.jpg" alt="" /> </div> <br /> <a onmouseover="imgOn ('http://img81.imageshack.us/img125/1945/hay21yz1.gif')" href="">Картинка2</a> | <a onmouseover="imgOn ('http://photos3.fotosearch.com/bthumb/CSP/CSP254/k2540937.jpg')" href="">Картинка3</a> | <a onmouseover="imgOn ('http://img-fotki.yandex.ru/get/4512/svetlera.44/0_50908_410dc7a8_S.jpg')" href="">Картинка4</a> |
Дело в том, что картинок много и преиодически их приходится менять. Раньше было какое-то универсальное решение, достаточно было прописать картинки в атрибуте у ссылки...
|
Цитата:
|
Цитата:
Триви предложил вам решение проблемы. что не так? |
Цитата:
иначе она начинает подгружаться только при наведении мышью на ссылку. Прописал вам автоматическую предварительную загрузку. Ссылки обязательно помещать в контейнер с id='links'. Может кто получше вариант предложит, я тока там могу )) <script type='text/javascript'> window.onload = function() { var str = document.getElementById("links").innerHTML, regexp = /"imgOn\s*\(\'(.+)\'\)"/gi, imgArr = []; for(var i=0; matches = regexp.exec(str); i++) { imgArr[i] = new Image(); imgArr[i].src = matches[1]; } } function imgOn (img) { document.getElementById("img1").src = img; } </script> <div style="height:150px"> <img id="img1" src="http://img-fotki.yandex.ru/get/5503/svetlera.1b3/0_57c30_ca388126_S.jpg" alt="" /> </div> <br /> <div id='links'> <a onmouseover="imgOn('http://img81.imageshack.us/img125/1945/hay21yz1.gif')" href="">Картинка2</a> | <a onmouseover="imgOn ('http://photos3.fotosearch.com/bthumb/CSP/CSP254/k2540937.jpg')" href="">Картинка3</a> | <a onmouseover="imgOn ('http://img-fotki.yandex.ru/get/4512/svetlera.44/0_50908_410dc7a8_S.jpg')" href="">Картинка4</a> </div> |
Часовой пояс GMT +3, время: 13:33. |