Сдвиг картинки-ссылки
<li><a href="#" onMouseOver="gogogo(this,29,0)" onMouseOut="gogogo(this, 60, -1)"><img src="css/images/q.png" width="100" height="20"></a></li>
function gogogo(node, i, sv) {
if (sv == 0) {
setTimeout(function() {node.style.left = i+1; i++; if (i<=60) gogogo(node, i, 0);},8);
}
else {
setTimeout(function() {node.style.left = i-1; i--; if (i>=29) gogogo(node, i, -1);},8);
}
}
Проблема в том, что при изменении положения указателя мыши начинает работать как if так и else. Думаю что проблему можно решить путем выделения определенной прямоугольной области, при наведении на который будет работать if, а за пределами есстественно else. Просьба помочь оптимизировать или подкинуть какие-нибудь другие идеи. |
кто-нибудь ответит?
|
что-то типа этого можно использовать
пример на jQuery нужно навести на картинку
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-git.js'></script>
<script type='text/javascript'>
$(window).load(function(){
$('div a').hover(
function () {
$(this).stop().animate({'margin-left': 30}, 300);
},
function () {
$(this).stop().animate({'margin-left': 0}, 300);
}
);
});
</script>
</head>
<body>
<div>
<a href="#"><img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"></a>
</div>
</body>
</html>
|
не силен в jQuery, и JS только начал изучать.
можете пояснить следующие моменты? 1. $(window).load(function() -- здесь мы подгружаем новую функцию? 2. $(this) - это $('div a')? 3. $('div a').hover - для чего hover? p.s. благодарю. |
Цитата:
2. в этом случае - да 3. http://api.jquery.com/hover/ |
Цитата:
|
Здравствуйте!
Тема уже старая, но у меня возник похожий вопрос, помогите пожалуйста. У меня есть круг (порезанный на куски) и когда я навожу на определенный кусок, он должен отодвигаться... Подскажите как это прописать? Со случаем вправо я уже разобрался)) методом тыка пробовал таким же образом задавать отступ вверх и вниз, но ничего не получается... Заранее благодарен! |
А случай "вправо" - это какой случай?)
Четче сформулируйте вопрос, выложите простой кусок html и ваш скрипт. |
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-git.js'></script>
<script type='text/javascript'>
$(window).load(function(){
$('div a').hover(
function () {
$(this).stop().animate({'margin-left': 50}, 300);
},
function () {
$(this).stop().animate({'margin-left': 0}, 300);
}
);
});
</script>
</head>
<body>
<div>
<a href="#"><img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"></a>
</div>
</body>
</html>
В данном случае прописывается margin-left 50 и изображение движется в право (так как отступ то левый) на 50 пикселей. Я пытался написать margin: 0 50 50 0; чтобы изображение двигалось вправо и вверх, но почему то не работает... подскажите как правильно прописывать в jQuery отступы, чтобы все работало) ну или я думал что может стоит прописывать не отступы, а задавать координаты относительно страницы, если это возможно, то подскажите как =) буду очень благодарен |
$(this).stop().animate({
'margin-left': 0,
'margin-top': '20px'
}, 300);
|
| Часовой пояс GMT +3, время: 13:07. |