Цикличное увеличение картинки
Обьясните пожалуйста, при наведении мышки на картинку она начинает циклично уменьшаться и увеличиваться одновременно, как это убрать:-? Надо чтобы она увеличивалась при наведении и уменьшалась при убирании с нее мышки
function bigPict(){
var w=document.tigr.width;
if (w>102){
document.tigr.width=w-5;
document.tigr.src="images/tigrenok.jpg"
setTimeout("bigPict()", 35)
}
if (w<302){
document.tigr.width=w+10;
document.tigr.src="images/tigrenok.jpg"
setTimeout("litlePict()", 1)
}
}
<img src="images/tigrenok.jpg" name="tigr" width="302" onMouseOver="bigPict()" onmouseover="litlePict()" > |
Сразу извеняюсь если написал не в том подфоруме, если не правильно ,прошу перенести:)
|
onmouseover и onmouseout, а не onmouseover и onmouseover
|
Все равноо та же проблема осталась, видимо они оба сразу берут одно и то же значение width и пытаються в одно и то же время его изменить:(
function bigPict(){
var w=document.tigr.width;
if (w>102){
document.tigr.width=w-5;
document.tigr.src="images/tigrenok.jpg"
setTimeout("bigPict()", 35)
}
if (w<302){
document.tigr.width=w+10;
document.tigr.src="images/tigrenok.jpg"
setTimeout("litlePict()", 1)
}}
<img src="images/tigrenok.jpg" name="tigr" width="302" onMouseOver="bigPict()" onMouseOut="litlePict()" > |
зачем ты каждый раз изменяешь путь к картинке?
и где функция litlePict ? вот то, что ты хотел получить Пример: или тут
<img src="http://cs5947.vkontakte.ru/u17024909/e_95a2680e.jpg" name="tigr" width="102" >
<script>
var img = document.tigr;
// можно и через html их назначить
// имена функций сохраненыв\
img.onmouseover=bigPict;
img.onmouseout=litlePict;
function bigPict(){
if (img.width<302){
img.width += 10;
setTimeout( bigPict, 10);
}
}
function litlePict(){
if (img.width>102){
img.width -= 5;
setTimeout( litlePict, 1);
}
}
</script>
|
Удивительно , но в браузере твой метод не работает:-?
А нет, твой метод работает, это я туплю, спс |
Не могу сделать для нескольких изображений
Вложений: 1
<script type="text/javascript">
function bigPict(i){ var a = document.getElementsByTagName('img'); if (a[i].width<300) { a[i].width += 10; setTimeout( bigPict, 10); } } function litlePict(i){ var b = document.getElementsByTagName('img') if (b[i].width>100){ b[i].width -= 5; setTimeout( litlePict, 1); } } </script> </head> <body> <img id="img1" src="cat.jpg" onmouseover="bigPict(0)" onmouseout="litlePict(0)" width="100" > <img id="img2" src="car.jpg" onmouseover="bigPict(1)" onmouseout="litlePict(1)" width="100" > </body> Не могу понять в чем ошибка! Изображение увеличивается при кожном наведении только один раз на 10px. Не могу понять в чем загвостка! Помогите пожалуйста! |
setTimeout( bigPict, 10);
// заменить на
setTimeout(function() { bigPict(i) }, 10);
с littlePict по аналогии |
| Часовой пояс GMT +3, время: 04:34. |