Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.06.2012, 08:22
Аспирант
Отправить личное сообщение для GrizzlyBear Посмотреть профиль Найти все сообщения от GrizzlyBear
 
Регистрация: 26.01.2011
Сообщений: 64

Скрытый блок
Скрытый блок при нажатии по ссылке открывается блок
что приписать надо, чтобы блок не просто появлялся а плавно выезжал

Последний раз редактировалось GrizzlyBear, 07.06.2012 в 17:39.
Ответить с цитированием
  #2 (permalink)  
Старый 07.06.2012, 11:51
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

Основы программной анимации на JavaScript

Либо найти в нете готовый код.

Или если используется какой то фреймворк, то возможно он имеет соответствующую функцию.
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #3 (permalink)  
Старый 07.06.2012, 12:34
Аватар для Dim@
Профессор
Отправить личное сообщение для Dim@ Посмотреть профиль Найти все сообщения от Dim@
 
Регистрация: 21.04.2012
Сообщений: 951

<html>
  <head> </head>
  <body>

    <script>
ok=true;
      document.num = 0;
      document.num2 = 1;
      function BLOK(){
      document.block = document.getElementById('block');
        if(ok == true){
document.num=0;
        smena()
        }
        else{document.num2=1;smena2()}
      }
      function smena(){
        document.num +=0.15;
        if(document.num > 1) return;
        document.block.setAttribute('style','opacity:'+document.num)
      setTimeout('smena()',100)
          }
      function smena2(){
      document.num2 -=0.15;
        if(document.num2 < 0){document.block.setAttribute('style','opacity:'+document.num2);return;}
        document.block.setAttribute('style','opacity:'+document.num2)
      setTimeout('smena2()',100)
      }
    </script>
    <a onclick='BLOK();if(ok==true){ok=false;}else{ok=true};return false' href='file:\\\lol'>Блок</a>
    <div id='block' style='opacity:0'>Я скрытый блок</div>
  </body>
</html>

Последний раз редактировалось Dim@, 07.06.2012 в 15:34.
Ответить с цитированием
  #4 (permalink)  
Старый 07.06.2012, 12:43
Аспирант
Отправить личное сообщение для GrizzlyBear Посмотреть профиль Найти все сообщения от GrizzlyBear
 
Регистрация: 26.01.2011
Сообщений: 64

Dim@

Это не совсем то
Нужно чтобы он не появлялся, а плавно выезжал

Последний раз редактировалось GrizzlyBear, 07.06.2012 в 23:47.
Ответить с цитированием
  #5 (permalink)  
Старый 07.06.2012, 12:48
Аватар для Dim@
Профессор
Отправить личное сообщение для Dim@ Посмотреть профиль Найти все сообщения от Dim@
 
Регистрация: 21.04.2012
Сообщений: 951

когда код заключаешь в теги js или html к первому тегу добавляешь run типа [js run]
Ответить с цитированием
  #6 (permalink)  
Старый 07.06.2012, 12:58
Аспирант
Отправить личное сообщение для GrizzlyBear Посмотреть профиль Найти все сообщения от GrizzlyBear
 
Регистрация: 26.01.2011
Сообщений: 64

Добавил работать отказывается почему то
все перепроверил, все ровно не работает
Ответить с цитированием
  #7 (permalink)  
Старый 07.06.2012, 13:08
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от GrizzlyBear
Нужно чтобы он не появлялся, а плавно выезжал
Чтобы плавно выезжал нун подключать библиотеку jQuery
К примеру так
<script src="http://code.jquery.com/jquery-1.7.2.min.js">

Тут есть примеры http://forumd.ru/viewtopic.php?id=1378&p=2#p68964 пост 13
Ответить с цитированием
  #8 (permalink)  
Старый 07.06.2012, 13:10
Аватар для Dim@
Профессор
Отправить личное сообщение для Dim@ Посмотреть профиль Найти все сообщения от Dim@
 
Регистрация: 21.04.2012
Сообщений: 951

<body>
<script type='text/javascript'>
num=-200
function viezd(){
num+=5;
if(num > 0) return;
block = document.getElementById('vnytr');
block.setAttribute('style','position:absolute;left:'+num+'px')
setTimeout('viezd()',100)
}
</script>
<a onclick='viezd();return false' href='file:\\\lol'>Выезд блока</a>
<div id='vnesh' style='width:400px;height:40px;position:absolute;left:0px;'><div id='vnytr' style='position:absolute;left:-200px'>Скрытый блок</div></div>

Вам нужно такое подобие?
Ответить с цитированием
  #9 (permalink)  
Старый 07.06.2012, 13:33
Аспирант
Отправить личное сообщение для GrizzlyBear Посмотреть профиль Найти все сообщения от GrizzlyBear
 
Регистрация: 26.01.2011
Сообщений: 64

Лан не парьтесь пока что
ща разберусь с кодом сделаю нормальный наглядный пример
Ответить с цитированием
  #10 (permalink)  
Старый 07.06.2012, 15:38
Аватар для Dim@
Профессор
Отправить личное сообщение для Dim@ Посмотреть профиль Найти все сообщения от Dim@
 
Регистрация: 21.04.2012
Сообщений: 951

Сообщение от GrizzlyBear Посмотреть сообщение
Добавил работать отказывается почему то
все перепроверил, все ровно не работает
вы код окружите тегами [html]
и в них добавьте run
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Показать/скрыть блок Lelja_05 jQuery 10 01.07.2013 20:05
Как сделать блок, исчезающий вверху страницы? TRos Элементы интерфейса 7 12.04.2012 08:59
Выдвижной блок fr0d Javascript под браузер 0 02.09.2011 17:37
Фиксированный блок kakarotto Элементы интерфейса 2 09.07.2010 00:20
Всплываюший блок! daron jQuery 5 14.05.2010 11:20