нет судьбы
С нами с 27.03.03
Сообщения: 4427
Рейтинг: 4204
 
|
 Добавлено: 12/09/11 в 14:13 |
Подскажите как оптимально забацать скриптец:
1) Есть кнопка (элементарная <img id=..>). Эта img должна по дефолту плавно мигать прозрачностью.
2) При наведении мышью на кнопку, мигание прекращяется с непрозрачностью 1 (100%).
1й пункт сам по себе реализуем на примерах, но вот привязка 2го пункта уже часов 10ть не даёт покоя 
|
|
|
|
| |
С нами с 31.05.10
Сообщения: 1991
Рейтинг: 487
|
| Добавлено: 12/09/11 в 15:52 |
ну ты бы хоть код выложил посмотреть 
|
|
|
|
| |
Любитель хорошего ;)
С нами с 08.06.07
Сообщения: 16151
Рейтинг: 6269
|
| Добавлено: 12/09/11 в 16:02 |
Можно по ховеру применять другой класс со 100% непрозрачностью.
А до этого отрабатывать изменение прозрачности. 
|
|
|
|
| |
С нами с 05.05.05
Сообщения: 1913
Рейтинг: 1134
|
| Добавлено: 12/09/11 в 20:05 |
как говориться,- сделано "на коленке", чисто из любопытства, но главное, что работает, если я правильно понял суть
| Код: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hover jQuery</title>
<style type="text/css">
/*<![CDATA[*/
body{
background: silver;
text-align: center;
}
button{
width: 100px;
height: 100px;
cursor: pointer;
}
/*]]>*/
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js">
</script>
<script type="text/javascript">
//<![CDATA[
(function () {
function flashing(event, button, conf) {
if (conf.flashing) {
conf.state = !(conf.state);
conf.state ? button.fadeOut(500) : button.fadeIn(500);
}
setTimeout(function () {
flashing(event, button, conf);
}, 1000);
}
var conf = {
flashing: true,
state: 0
}
$(function () {
var myButton = $("#flashing");
myButton
.bind("flashing", flashing)
.trigger("flashing", [myButton, conf])
.hover(
function (e) {
conf.flashing = false;
conf.state = 0;
$(this).fadeIn(500);
},
function (e) {
conf.flashing = true;
}
);
});
})();
//]]>
</script>
</head>
<body>
<button id="flashing">My Button</button>
</body>
</html> |
пришел к тому что нужен объект который бы хранил состояние
|
|
|
|
| |
С нами с 27.09.03
Сообщения: 5454
Рейтинг: 2506
|
| Добавлено: 12/09/11 в 20:39 |
| freeek писал: | | как говориться,- сделано "на коленке", чисто из любопытства, но главное, что работает, если я правильно понял суть |
херасе ты альтруист такое забацать 
|
|
|
|
| |
нет судьбы
С нами с 27.03.03
Сообщения: 4427
Рейтинг: 4204
|
| Добавлено: 12/09/11 в 21:38 |
| grozny писал: | | херасе ты альтруист такое забацать smail101.gif |
угу, заценил страдания!
Вобще я за основу юзал этот пример:
| Код: | <script language="JavaScript" type="text/javascript">
$(document).ready(function(){
setInterval(
function()
{
$("#test").fadeTo(700,0).fadeTo(700,1);
},100);
});
</script>
...
<h1 id=’test’>Мигающий текст!!!</h1> |
Последний раз редактировалось: Vyacheslav (12/09/11 в 21:55), всего редактировалось 1 раз
|
|
|
|
| |
нет судьбы
С нами с 27.03.03
Сообщения: 4427
Рейтинг: 4204
|
| Добавлено: 12/09/11 в 21:42 |
Но всё-равно молоток, я сначала кстати этот код же юзал.
Только не догонял, как hover должен останавливать.
|
|
|
|
| |
С нами с 05.05.05
Сообщения: 1913
Рейтинг: 1134
|
| Добавлено: 12/09/11 в 21:45 |
jQuery API если надо
главное сама мысль в каком направлении идти, а дальше переделать можно как угодно 
|
|
|
|
| |
нет судьбы
С нами с 27.03.03
Сообщения: 4427
Рейтинг: 4204
|
| Добавлено: 12/09/11 в 21:54 |
Да я тоже так думал, что мин 15-20 потрачу, с условием, что раза три за жизнь на javascript что-то лабал.. Но как оказалось, отсутствие знаний архитектуры языка и особенностей jquery сильно ударило по яйцам!
|
|
|
|
| |
нет судьбы
С нами с 27.03.03
Сообщения: 4427
Рейтинг: 4204
|
| Добавлено: 13/09/11 в 23:38 |
Ещё такой вопрос..
Стоит ли выносить jQuery код (подобный тому, что разработал freeek:) в отдельные документы js или непосредственно в <head> самого документа, в альтернативу включения в общий main.js? Имеею ввиду, не смешивать с тем кодом, который может рабоать самостоятельно. Если сам jQuery вдруг не подключится (гипотетически), то код для jQuery может как-то навредить коду, который должен работать без него..
|
|
|
|
| |
С нами с 05.05.05
Сообщения: 1913
Рейтинг: 1134
|
| Добавлено: 14/09/11 в 23:53 |
| Код: | function FlashingElement(elemID) {
if (!window.jQuery) return;
var myButton = jQuery(elemID);
var flashing = true;
myButton.hover(
function (e) {
flashing = false;
$(this).show();
}, function (e) {
flashing = true;
});
setInterval(function(){
if (flashing) {
myButton.fadeOut(700).fadeIn(700);
}
},1000);
} |
вот, еще укороченный вариант, можешь ее в отдельный файл положить, если надо
вызывать в блоке инициализации jQuery, либо после элемента, который надо анимировать, в общем как обычный скрипт (при условии что jQuery загружен, иначе работать не будет)
вызывать так
| Код: | | FlashingElement("#someID"); |
в принципе что передавать в функцию, если надо сам решишь, там не сложно переделать
|
|
|
|
| |
