Выезжающий контент, простенький скриптик.
Вот.
[HTML]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Language" content="en-us">
<script language="javascript">
<!--
$=function(id){return document.getElementById(id)}
function load(){ // предварительные настройки стилей
var os=$('layer1').style
os.top=$('layer2').offsetTop+'pt'
os.left=$('layer2').offsetLeft+'pt'
os.width=$('t1').offsetWidth+'pt'
os.zIndex=1
if ($('t1').filters){
$('t1').style.filter='alpha(opacity=0)'}
else{$('t1').opacity=0}
$('t1').style.height=0+'pt'
}
function flu_op(r){
var i=100 // максимальный размер раскрытия (pt)
var t=10 // продолжительность эффекта
if (r.style.height==0+('pt')){
for (c=0;c<=i;c++){
setTimeout(function (r,c){return function(){r.style.height=c+'pt'}}(r,c),t*c)}}
else{
for (c=i;c>=0;c--){
setTimeout(function (r,c){return function(){r.style.height=c+'pt'}}(r,c),t*(i-c))}}
}
//-->
</script>
</head>
<body style="margin: 0; padding: 0" onload=load()>
<p>
<input type=button value="Открыть" id=b1 onclick="flu_op($('t1'))"> </p>
<div id=layer2 style="position: absolute; z-index: 2; left:27px; top:101px; width:197px">
<table>
<tr id=t1 height=0>
<td>
</td>
</tr>
</table>
<p lang="ru" style="background-color:#FFFFFF">
Здесь текст, чтобы видно было как раскрывается ячейка.<br>
Здесь ещё....<br>
И ещё.....<br>
<br>
</p>
</div>
<div id=layer1 style="position: absolute; z-index: 1">
<table>
<tr>
<td colspan="2" align="center"><b>Боты</b></td>
</tr>
<tr>
<td title="3 мин. 45 сек.">Google Bot</td>
<td align="right">Files</td>
</tr>
<tr>
<td title="10 мин. 8 сек.">Yahoo Bot</td>
<td align="right">Mainpage</td>
</tr>
</table>
</div>
</body>
</html> [/HTML]
[HTML]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Language" content="en-us">
<script language="javascript">
<!--
$=function(id){return document.getElementById(id)}
function load(){ // предварительные настройки стилей
var os=$('layer1').style
os.top=$('layer2').offsetTop+'pt'
os.left=$('layer2').offsetLeft+'pt'
os.width=$('t1').offsetWidth+'pt'
os.zIndex=1
if ($('t1').filters){
$('t1').style.filter='alpha(opacity=0)'}
else{$('t1').opacity=0}
$('t1').style.height=0+'pt'
}
function flu_op(r){
var i=100 // максимальный размер раскрытия (pt)
var t=10 // продолжительность эффекта
if (r.style.height==0+('pt')){
for (c=0;c<=i;c++){
setTimeout(function (r,c){return function(){r.style.height=c+'pt'}}(r,c),t*c)}}
else{
for (c=i;c>=0;c--){
setTimeout(function (r,c){return function(){r.style.height=c+'pt'}}(r,c),t*(i-c))}}
}
//-->
</script>
</head>
<body style="margin: 0; padding: 0" onload=load()>
<p>
<input type=button value="Открыть" id=b1 onclick="flu_op($('t1'))"> </p>
<div id=layer2 style="position: absolute; z-index: 2; left:27px; top:101px; width:197px">
<table>
<tr id=t1 height=0>
<td>
</td>
</tr>
</table>
<p lang="ru" style="background-color:#FFFFFF">
Здесь текст, чтобы видно было как раскрывается ячейка.<br>
Здесь ещё....<br>
И ещё.....<br>
<br>
</p>
</div>
<div id=layer1 style="position: absolute; z-index: 1">
<table>
<tr>
<td colspan="2" align="center"><b>Боты</b></td>
</tr>
<tr>
<td title="3 мин. 45 сек.">Google Bot</td>
<td align="right">Files</td>
</tr>
<tr>
<td title="10 мин. 8 сек.">Yahoo Bot</td>
<td align="right">Mainpage</td>
</tr>
</table>
</div>
</body>
</html> [/HTML]
Я не понял, это вопрос или ты просто хвастаешся?
Ну почему обязательно вопрос? Что, нельзя просто скриптик выложить? Может кому сгодится...
Ну идея интересная. Но не понятно, почему так долго грузится?
Не сделана проверка на то, что цикл уже запущен (что слайд уже в движении). Попробуй быстро понажимать на кнопку.