Извиняюсь, если уж совсем простой вопрос. Как спрятать или показать текст с плавными эффектами, это не так уж и сложно, но как сделать постоянный эффект анимации без обновления страницы? Т.е. например, есть блок:
Code
<div id="tblink">Блок с текстом для примера</div>
как сделать чтобы текст плавно появлялся и так же исчезал постоянно делая петлю, ну или ещё проще сказать плавно мигающий текст. Желательно пример попроще, не хотелось бы слишком нагружать страницу. Это своего рода украшательство или способ привлечь к определенному тексту внимание. Мне бы оно совсем не надо было, просто занимаюсь совместно одним сайтом, где подобный эффект выведен с помощью флэш, мне это не очень нравится и хотелось бы выводить хотя бы с помощь скрипта, совсем отговорить от мигающего текста не получилось.:) Почему-то примеры которые я находил на JavaScript слишком массивные.
Сообщение отредактировал Komoff - Суббота, 03.09.2011, 16:48
как сделать чтобы текст плавно появлялся и так же исчезал постоянно делая петлю, ну или ещё проще сказать плавно мигающий
Какой хороший вопрос, а сучётом вчерашней, и, кажется позавчерашней попойки так вообще..... Вошел я с третьего раза и то случайто, но решил, одако ... не такую уж и сложную задачку .... По сути пишем функцию которая все это будет делать - то бишь скрывать и показывать элемент, ... и .... и всё а! ставим таймер на это дело .... Короче, вот код, запускается при клике, кожно поставить на автозагрузку .... (блин, чё за клавиатура - клавиши все разбросаны ....) .... Стили:
<script type="text/javascript"> function tblink(){ var obj=$('#tblink'); ($('#tblink').is(":hidden"))?obj.fadeIn():obj.fadeOut() setTimeout("tblink('700')",0); }; </script>
HTML:
Code
<h1 id="tblink" onclick="tblink();return false;">Блок с текстом для примера</h1>
likbezz, спасибо! Извини что побеспокоил в это суровое время.
Quote (likbezz)
а сучётом вчерашней, и, кажется позавчерашней попойки так вообще.....
Первосентября праздновал?)) В общем-то по теме, поставил мигание основываясь на твоем скрипте и дополнив чужим, и как оказалось, что это не прикольно выглядит. Поэтому не знаю, или поищу другой эффект, типа выбегающей надписи или уговорю окончательно обойтись без мигалок. Но за скрипт спасибо, может к чему-нибудь другому приделаю.
что нужно изменить в коде твоего мигающего текста, чтобы он без наведения мышки автоматически появлялся плавно, а через некоторое время плавно исчезал
Типа совсем? Вот так, например:
Code
<h1 id="tblink">Блок с текстом для примера</h1> <script type="text/javascript"> function tblink(n){var obj=$('#tblink'); if(n){ ($('#tblink').css('opacity')=='0')?obj.stop(true).animate({opacity:'1'},300):obj.animate({opacity:'0'},300) setTimeout("tblink("+(n-1)+")",600); };};tblink(11); </script>
Где: tblink(11); «11» - кол-во миганий умноженное на два. Если число четное - остановится и будет виден, если НЕ четное - 7,11,13 - остановится и исчезнет. ...
просто на данный момент сначала он появляется резко
Просто на данный момент текст уже есть, и виден - установи тексту изначально стиль opacity:0 ... тогда будет появляться плавно. ... По теме: Прозрачность элементов при помощи CSS
<h1 class="tblink">Блок с текстом для примера 1</h1> <h1 class="tblink">Блок с текстом для примера 2</h1> <h1 class="tblink">Блок с текстом для примера 3</h1> <h1 class="tblink">Блок с текстом для примера 4</h1> <h1 class="tblink">Блок с текстом для примера 5</h1>
Code
<script type="text/javascript"> function tblink(n){ if(n){ var obj=$('.tblink'); (obj.css('opacity')=='0')?obj.stop(true).animate({opacity:'1'},300):obj.animate({opacity:'0'},300) setTimeout("tblink("+(n-1)+")",600); };}; $('.tblink').css('opacity','0'); tblink(10); </script>