Конференция Opera AC community

  • 24.06.2019, 14:56:06 *
  • Добро пожаловать, Гость
Пожалуйста, войдите или зарегистрируйтесь.

Расширенный поиск  
collapse
* Голосование
  • Нравится ли Вам Opera AC?
  • Dot Конечно, она просто супер!
  • 1598 (77%)
  • Dot В целом да, но много лишнего..
  • 366 (17%)
  • Dot Для ознакомительных целей
  • 65 (3%)
  • Dot Нет
  • 24 (1%)
  • Dot А что это такое?
  • 20 (0%)
  • Проголосовало пользователей: 2027
  • Смотреть тему

Реклама:

Автор Тема: Плавно выподающий div  (Прочитано 7572 раз)

0 Пользователей и 1 Гость просматривают эту тему.

SA_

  • Пользователь
  • **
  • Репутация: 0
  • Оффлайн Оффлайн
  • Пол: Мужской
  • Сообщений: 20
  • forever ;)
  • OS:
  • Windows 7/Server 2008 R2 Windows 7/Server 2008 R2
  • Browser:
  • Opera 10.00 Opera 10.00
Плавно выподающий div
« : 01.10.2009, 10:02:54 »
доброго времени
может кто знает как сделать так чтобы div плавно появлялся
Поискал в интернете нашёл такой пример (см ниже)
 Но здесь див просто показывается, а мне хотелось бы чтоб он «выползал»


Цитировать
<script>
function collapsElement(id) {
    if ( document.getElementById(id).style.display != "none" ) {
        document.getElementById(id).style.display = 'none';
    }
    else {
        document.getElementById(id).style.display = '';
    }
}
</script>

<a href="javascript:collapsElement('div11')" onfocus="this.blur()"><span id="span11">Заголовок (по нажатию видно подробная инфа)</span>[/url]
<div style="display:none" id="div11">
ну а тут подробнее...

ну а тут подробнее...

ну а тут подробнее...

ну а тут подробнее...

</div>

Если кто встречался или делал, подскажите
pS. да если не туда написал то простите и поправте  :-[
« Последнее редактирование: 01.10.2009, 10:05:01 от SA_ »
Записан

Lex1

  • Админ
  • *
  • Репутация: 9
  • Оффлайн Оффлайн
  • Сообщений: 1739
  • OS:
  • Windows XP Windows XP
  • Browser:
  • Mozilla совместимость Mozilla совместимость
Re: Плавно выподающий div
« Ответ #1, : 01.10.2009, 10:54:27 »
Используется window.setInterval и там увеличивается размер дива. Нечто подобное я делал в block-external-scripts.js
Ну и во многих фреймворках есть готовые функции для этого, если речь про сайт.
Добавлено: Чтв 01 Окт 2009 12:04:22

Код: [Выделить]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>

<script type="text/javascript">
function show(b){
if(b.style.visibility == 'visible'){b.style.visibility = 'hidden'; return};
var maxWidth = b.offsetWidth;
b.style.width = 0;
b.style.visibility = 'visible';
var timer = window.setInterval(function(){
var width = parseInt(b.style.width) + 20;
if(width > maxWidth){clearTimeout(timer); width = maxWidth};
b.style.width = width + 'px';
}, 10);
}
</script>

<style type="text/css">
</style>

</head>
<body>
<input type="button" value="Show" onclick="show(mydiv)">

<div style="visibility:hidden;overflow:hidden;width:300px;height:300px;background-color:green;" id="mydiv">

</div>

</body>
</html>
« Последнее редактирование: 01.10.2009, 12:12:17 от Lex1 »
Записан

SA_

  • Пользователь
  • **

    • Автор темы
  • Репутация: 0
  • Оффлайн Оффлайн
  • Пол: Мужской
  • Сообщений: 20
  • forever ;)
  • OS:
  • Windows 7/Server 2008 R2 Windows 7/Server 2008 R2
  • Browser:
  • Opera 10.00 Opera 10.00
Re: Плавно выподающий div
« Ответ #2, : 01.10.2009, 11:23:34 »
большое спасибо!  :) дальше сделаю как мне надо  :super:
Записан
 


Реклама:

Счетчик

Страница сгенерирована за 0.127 секунд. Запросов: 35.