Javascript.RU

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

плавный переход через javascript
помогите реализовать плавный переход через javascript

есть блок, изначально у него display : none
при клике, мне нужно чтобы он стал блочным и у него был плавный переход opacity
но никак не хочет работать...


я пытался реализовать по разному


но работает только тогда когда
  • в css уже стоит display: block
  • и только когда использую box_hider.style.opacity = '0.9'; (если пытаюсь через javascript поменять display на block то не работает)

по другому никак не хочет работать....

подскажите как сделать как чтобы при клике, display ставал block и плавно переходило opacity
Ответить с цитированием
  #2 (permalink)  
Старый 19.01.2014, 14:04
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 2,932

http://learn.javascript.ru/play/Ib6W1b

<!DOCTYPE HTML>
<html>
  
  <head>
    <style>
      #myDiv {
        background: #000;
        height: 100px;
        width: 100px;
        transition: opacity 0.5s;
        -moz-transition: opacity 0.5s;
        -o-transition: opacity 0.5s;
        -webkit-transition: opacity 0.5s;
      }
      .hide {
          opacity: 0;
      }
    </style>
  </head>
  
  <body>
    <div id="myDiv"></div>
    
    <script>
      var myDiv = document.getElementById('myDiv').onclick = function() {
        var hide = this.classList.contains('hide');
        this.classList[hide ? 'remove' : 'add']('hide');
      }
    </script>
  </body>

</html>


Ну, а с display уже сами.

Последний раз редактировалось ruslan_mart, 19.01.2014 в 14:07.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Файл через JavaScript JSN Ваши сайты и скрипты 5 02.08.2013 12:31
Плавный переход background-а x-miller-x Общие вопросы Javascript 5 01.04.2013 10:11
recaptcha через javascript KOLANICH Общие вопросы Javascript 1 11.10.2010 07:35
Обращение к именам, полученным через Javascript baal1988 Events/DOM/Window 1 31.08.2008 14:08
Поиск в массиве через JavaScript Noran Общие вопросы Javascript 0 10.08.2008 16:31