Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.08.2009, 13:19
Новичок на форуме
Отправить личное сообщение для uoziod Посмотреть профиль Найти все сообщения от uoziod
 
Регистрация: 28.08.2009
Сообщений: 2

знатоки, помогите реализовать задачу!
Приветствую, уважаемые форумчане JavaScript.ru!

Есть у меня задача, за решением которой применяя jQuery хочу к Вам обратиться.

Есть ряд DIV'ов с постоянным размером. Задача сделать анимационный эффект, чтобы эти DIV'ы в определённом месте с использованием эффектов fadeOut/fadeIn поочерёдно исчезали и появлялись...

Умения работы с jQuery у меня настолько малы, что я даже не представляю, с чего начать((( Дайте пинок)))
Ответить с цитированием
  #2 (permalink)  
Старый 28.08.2009, 14:27
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

http://docs.jquery.com/
http://linksexchanger.ru/
И задача как-то размыто поставлена. Что значит поочередно? Один фейднулся, потом следующий?
Ответить с цитированием
  #3 (permalink)  
Старый 28.08.2009, 14:29
Новичок на форуме
Отправить личное сообщение для uoziod Посмотреть профиль Найти все сообщения от uoziod
 
Регистрация: 28.08.2009
Сообщений: 2

именно! на одном и том же месте, одинаковые по размерам дивы. первый висит секунд 5, затем фэйдаут и в этот же момент уже фэйдин следующего. тот стоит 5 сек, дальше... и пошла-пошла-пошла!
Ответить с цитированием
  #4 (permalink)  
Старый 28.08.2009, 14:59
Аватар для e1f
e1f e1f вне форума
Профессор
Отправить личное сообщение для e1f Посмотреть профиль Найти все сообщения от e1f
 
Регистрация: 03.04.2009
Сообщений: 1,263

Так?
<!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>TEST</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
div.banner {
    width: 200px;
    height: 100px;
    border: 3px solid green;
    text-align: center;
    display: none;
}
</style>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
<!--
function fadeInOut(el, cb) {
    $(el).fadeIn(2000, function(){
        $(el).fadeOut(2000, function(){
            cb && cb(el);
        });
    });
}
$(function(){
    fadeInOut($('div.banner:first'), function(el){
        var next = el.next('div.banner');
        next.size() && fadeInOut(next, arguments.callee);
    });
});
//-->
</script>
</head>

<body>
<div class="banner">I'm 1st div in query</div>
<div class="banner">I'm 2nd div in query</div>
<div class="banner">I'm 3rd div in query</div>
<div class="banner">I'm 4th div in query</div>
<div class="banner">I'm 5th div in query</div>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как реализовать? Fliand Элементы интерфейса 4 22.08.2009 19:47
помогите задать селектор! mkrylov jQuery 2 28.06.2009 20:34
Помогите реализовать scale по mouseenter WildMaN jQuery 5 06.11.2008 09:51
Помогите решить задачу vkg Общие вопросы Javascript 1 20.02.2008 11:59