Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Почему картинка так дергается? (https://javascript.ru/forum/misc/16660-pochemu-kartinka-tak-dergaetsya.html)

9xakep 16.04.2011 20:03
Почему картинка так дергается?
 

<script type="text/javascript">
function pr() {
var w=document.chel.width;
if (w<640) {
document.chel.width=w+10;
document.chel.src="http://goiron.enetgallery.com/_ph/1/224558321.jpg"
setTimeout("pr()", 1);
}
}
function mn() {
var w=document.chel.width;
if (w>300) {
document.chel.width=w-10
document.chel.src="http://goiron.enetgallery.com/_ph/1/224558321.jpg"
setTimeout("mn()", 1);
</script>
<img src="http://goiron.enetgallery.com/_ph/1/224558321.jpg" width="300" name="chel" onMouseOver="pr()" onMouseout="mn()">

9xakep 16.04.2011 20:05
от есть,если навести курсор и ждать до конца,а потом отвести мышку,то она нормально увеличивается\уменьшается, но если условно она увеличиться не до конца,и в этот момент отвести курсор,то она по идее должна уменьшаться,но в место того,она начинает дургаться?!

dmitriymar 16.04.2011 20:25
выполнение по таймеру отменяй. как при уводе так и при наведении -до вызова функции.
у тебя при уведении начинают работать 2 таймера на увеличение и на уменьшение
да и аргументы в запуске таймера записывай правильно
http://javascript.ru/setTimeout

9xakep 16.04.2011 20:50
а можно без таймера,но что бы увеличивалось плавно?

dmitriymar 16.04.2011 21:01
нет ,если хочешь плавного увеличения.перед вызовом функции отмени выполнение по таймеру и всё

9xakep 16.04.2011 21:08
...Немного не понял...так чтоли?:
<script type="text/javascript">
function pr() {
var w=document.chel.width;
if (w<400) {
document.chel.width=w+10;
document.chel.src="http://goiron.enetgallery.com/_ph/1/224558321.jpg"

}
}
function mn() {
var w=document.chel.width;
if (w>300) {
document.chel.width=w-10
document.chel.src="http://goiron.enetgallery.com/_ph/1/224558321.jpg"

}
}
</script>
<img src="http://goiron.enetgallery.com/_ph/1/224558321.jpg" width="300" name="chel" onMouseOver="pr()" onMouseout="mn()">

Так же получается не плавно?

dmitriymar 16.04.2011 21:17
оставь таймеры в покое-я разве сказал убери таймеры? перепиши их согласно статьи ,на какую дал ссылку. и, в обработчиках пред вызовом функций ,увеличения и уменьшения отменяй таймеры.
перед вызовом функции в онмаусоут-отменяй таймер функции увеличения .
и в онмаусовер отменяй таймер уменьшения.

dmitriymar 16.04.2011 21:19
Цитата:
Сообщение от 9xakep
...Немного не понял...так чтоли?:
показать чистый исходник в новом окнеСкрыть/показать номера строкпечать кода с сохранением подсветки
01 <script type="text/javascript">
02 function pr() {
03 var w=document.chel.width;
04 if (w<400) {
05 document.chel.width=w+10;
06 document.chel.src="http://goiron.enetgallery.com/_ph/1/224558321.jpg"
07
08 }
09 }
10 function mn() {
11 var w=document.chel.width;
12 if (w>300) {
13 document.chel.width=w-10
14 document.chel.src="http://goiron.enetgallery.com/_ph/1/224558321.jpg"
15
16 }
17 }
18 </script>
19 <img src="http://goiron.enetgallery.com/_ph/1/224558321.jpg" width="300" name="chel" onMouseOver="pr()" onMouseout="mn()">

Так же получается не плавно?
так получится тоже плавно ,но очень быстро.
плавно-антоним словам -резко,рывками но не слову быстро:D

9xakep 16.04.2011 21:39
Цитата:
Сообщение от dmitriymar (Сообщение 101008)
оставь таймеры в покое-я разве сказал убери таймеры? перепиши их согласно статьи ,на какую дал ссылку. и, в обработчиках пред вызовом функций ,увеличения и уменьшения отменяй таймеры.
перед вызовом функции в онмаусоут-отменяй таймер функции увеличения .
и в онмаусовер отменяй таймер уменьшения.
Можешь написать полный готовый код если не сложно,я уже потом разберусь,пожалуйста.

dmitriymar 16.04.2011 21:44
9xakep,
принципиально не буду. я тебе дал ссылку на статью, а ты ,либо:
1- принципиально не читал
2-читал ,но не понял и принципиально решил не разбираться в ней

9xakep 17.04.2011 07:39
Я её читал,но не понял где моя ошибка,а ты вместо того чтобы умничать,со своими принципами,мог бы просто помочь,потому что не все такие "крутые"...

walik 17.04.2011 10:33
Отменяй таймер функцией clearTimeout
Проверяй по условию что если уже достаточно увеличил, то отменяй.

9xakep 17.04.2011 19:57
Ну сейчас то почему не работает?!
<script type="text/javascript">
function pr() { //функция...
var w=document.chel.width; //переменная w равна ширине
if (w<400) { //если ширина меньше 400,то...
document.chel.width=w+10; //ширину прибавлявть по 10пикселей
setTimeout(go, 10); //и так повторять,и с интевалом по 10миллисекунды
}//конец if
}//конец функции
function d() { //начало функции благодаря которой изображение не будет увеличиваться
var timeout_id = setTimeout(go, 10); //переменная как по уроку
clearTimeout(timeout_id); //отменить "timeout_id" который есть-"setTimeout(go, 10)"
} //конец функции
</script>
<img src="http://goiron.enetgallery.com/_ph/1/224558321.jpg" width="300" name="chel" onMouseout="d()" onMouseOver="pr()">

Получается:при наведении на рисунок,должна срабатывать функция pr() по которой,картинка должна увеличиваться,после, если отвести курсор,то функция d() должна отменить действие в функции pr()?Где ошибка в моем коде или в рассуждениях??А получается так что:навожу на картинку,она увеличивается на 10пикселей и все

walik 17.04.2011 21:17 
<html>
<head>
<script type="text/javascript" language="javascript">
var timer;

function pr() {
	var w=document.chel.width;
	clearTimeout(timer);
	if (w<640) {
		document.chel.width=w+10;
		timer = setTimeout("pr()", 1);
	}
}
function mn() {
	var w=document.chel.width;
	clearTimeout(timer);
	if (w>300) {
		document.chel.width=w-10
		timer = setTimeout("mn()", 1);
	}
}
</script>
</head>
<body>
<img src="http://goiron.enetgallery.com/_ph/1/224558321.jpg" width="300" name="chel" onMouseOver="pr()" onMouseout="mn()">
</body>
</html>

9xakep 17.04.2011 21:40
Спасибо...


Часовой пояс GMT +3, время: 00:22.