如何使用javascript实现网页上相册的3D特效
更新日期：2024.05.07
<html>
<head>
</head>
<body>
<script type="text/javascript">
var createDiv = document.createElement("div");
//createDiv.innerHTML = "adasas"
createDiv.style.height = "122px";
createDiv.style.width = "122px";
document.body.appendChild(createDiv);
createDiv.style.position = "absolute";
createDiv.style.overflow = "hidden";
createDiv.style.top = "200px";
createDiv.style.left = "200px";
var createImg = document.createElement("img");
createImg.setAttribute("src","https://gss0.bdstatic.com/70cFsjip0QIZ8tyhnq/img/logo-zhidao.gif");
createImg.height = 122;
createImg.width = 122;
createDiv.appendChild(createImg);
var isenlarge = 0;
createImg.onmouseover = function()
{
isenlarge = 1;
enlarge();
};
createImg.onmouseout = function()
{
isenlarge = 0;
narrow();
};
var w = 122;
var h = 122;
var a = 0;
var ctr1 = setInterval("move()",17);
function move()
{
if ( a >= 90 && a <= 270)
{
w > 80 ? w-- : 0;
h > 80 ? h-- : 0;
}
else
{
w < 130? w++ : 0;
h < 130? h++ : 0;
}
createDiv.style.height = h;
createDiv.style.width = w;
createImg.height = h;
createImg.width = w;
createDiv.style.top = 500 + Math.sin( a * 0.017453293) * 100;
createDiv.style.left = 400 + Math.cos( a * 0.017453293) * 300 ;
a += 1;
a >= 360? a = 0 : 0;
}
function enlarge()
{
if ( createImg.height < 250 && createImg.width < 250 && isenlarge == 1 )
{
clearInterval( ctr1);
createImg.height += 3;
createImg.width += 3;
createDiv.style.height = createImg.height;
createDiv.style.width = createImg.width;
setTimeout( "enlarge()", 30);
}
}
function narrow()
{
if ( createImg.height > h && createImg.width > w && isenlarge == 0)
{
createImg.height -= 3;
createImg.width -= 3;
createImg.height < h? createImg.height = h : 0;
createImg.width < w? createImg.width = w : 0
createDiv.style.height = createImg.height;
createDiv.style.width = createImg.width;
setTimeout( "narrow()", 30);
}
else
{
ctr1 = setInterval("move()",17);
}
}
</script>
</body>
</html>
IE下目测没问题吧，我写的不规范的。。外观也很丑- -！
13459236186 :如何用javascript设置延时执行
祁柿呼3382 :答：三、setTimeout详解 var t=setTimeout("javascript 语句",时间参数)注：时间参数单位为毫秒 示例：var t=setTimeout("alert('3 seconds!')",3000)如果js语句带变量，则必须用+号将变量连接起来，如：var t=set...
13459236186 :如何用javascript实现点击换class
祁柿呼3382 :答：你的程序可以改成：function navbar(className){ var nav=document.getElementById("nav");nav.className = nav.className=="navbar"?"tnavbar":"navbar";} 以下我刚刚写的测试程序，证明上面的.className换class是没...
13459236186 :如何实现javascript js 类命名空间的写法
祁柿呼3382 :答：< input type="button" value="命名空间使用" onclick="t.$();"/> < script type="text/javascript"> (function namespace(){ this.$=function(){ alert(‘命名空间使用！’);} window.t ={};window.t=this;...
13459236186 :JavaScript实现当分钟和秒小于10的情况,前面补0显示
祁柿呼3382 :答：var s=1 , m=2;// 根据长度来判断var strS=s.toString() , strM=m.toString();if(strS.length<2) strS='0'+strS;if(strM.length<2) strM='0'+strM;
13459236186 :用JavaScript实现表格中点击编辑该表格框就变为文本框
祁柿呼3382 :答： function edit1(o){ o.style.display="none";form1.s.value=o.innerHTML;document.getElementById("t_edit").style.display="block";} function submit1(){ form1.submit();} ...
13459236186 :javascript:excel函数中计算t值的TINV函数,在javascript中如何使用...
祁柿呼3382 :答：TINV 返回 t 值，P(|X| > t) = probability，其中 X 为服从 t 分布的随机变量，且 P(|X| > t) = P(X < -t or X > t)。单尾 t 值可通过用两倍概率替换概率而求得。如果概率为 0.05 而自由度为 10...
13459236186 :静态网页中如何用js实现搜索功能?
祁柿呼3382 :答： var searchobj = new Object;var rng = new Object;searchobj.row = -1;searchobj.col = -1;function searchclick(){ findText2("test",txtFind.value);} function findText2(tabname,str){ var tab = documen...
13459236186 :2、javascript+CSS+Html实现用户注册及登录的格式验证。在用户登录功...
祁柿呼3382 :答：下面是关键代码，如果剩下的你都搞不懂，我就无语了 JS function reloadcodeOne(){//刷新验证码函数 var verify = document.getElementById('checkCodeImg');verify.setAttribute('src', 'validateCode?dt=' + Math...
13459236186 :怎么用js实现延时弹出窗口
祁柿呼3382 :答：延迟出口弹出，最简单方法就是用js里的setTimeout方法，下面是一个简单的例子：<div id="div" style="width:100px; height:100px; background:#ccc; display:none;"var oDiv = document.getElementById('div');var...
13459236186 :javascript怎么实现双击网页后自动滚动网页?本人对javascript不是很熟 ...
祁柿呼3382 :答： var t=0; window.ondblclick=function(){ if(t){ clearInterval(t); t=0; }else{ t=setInterval(function(){ scrollBy(0,5); //每次滚动5像素 },50); //每次滚动时间间隔50...
<head>
</head>
<body>
<script type="text/javascript">
var createDiv = document.createElement("div");
//createDiv.innerHTML = "adasas"
createDiv.style.height = "122px";
createDiv.style.width = "122px";
document.body.appendChild(createDiv);
createDiv.style.position = "absolute";
createDiv.style.overflow = "hidden";
createDiv.style.top = "200px";
createDiv.style.left = "200px";
var createImg = document.createElement("img");
createImg.setAttribute("src","https://gss0.bdstatic.com/70cFsjip0QIZ8tyhnq/img/logo-zhidao.gif");
createImg.height = 122;
createImg.width = 122;
createDiv.appendChild(createImg);
var isenlarge = 0;
createImg.onmouseover = function()
{
isenlarge = 1;
enlarge();
};
createImg.onmouseout = function()
{
isenlarge = 0;
narrow();
};
var w = 122;
var h = 122;
var a = 0;
var ctr1 = setInterval("move()",17);
function move()
{
if ( a >= 90 && a <= 270)
{
w > 80 ? w-- : 0;
h > 80 ? h-- : 0;
}
else
{
w < 130? w++ : 0;
h < 130? h++ : 0;
}
createDiv.style.height = h;
createDiv.style.width = w;
createImg.height = h;
createImg.width = w;
createDiv.style.top = 500 + Math.sin( a * 0.017453293) * 100;
createDiv.style.left = 400 + Math.cos( a * 0.017453293) * 300 ;
a += 1;
a >= 360? a = 0 : 0;
}
function enlarge()
{
if ( createImg.height < 250 && createImg.width < 250 && isenlarge == 1 )
{
clearInterval( ctr1);
createImg.height += 3;
createImg.width += 3;
createDiv.style.height = createImg.height;
createDiv.style.width = createImg.width;
setTimeout( "enlarge()", 30);
}
}
function narrow()
{
if ( createImg.height > h && createImg.width > w && isenlarge == 0)
{
createImg.height -= 3;
createImg.width -= 3;
createImg.height < h? createImg.height = h : 0;
createImg.width < w? createImg.width = w : 0
createDiv.style.height = createImg.height;
createDiv.style.width = createImg.width;
setTimeout( "narrow()", 30);
}
else
{
ctr1 = setInterval("move()",17);
}
}
</script>
</body>
</html>
IE下目测没问题吧，我写的不规范的。。外观也很丑- -！
祁柿呼3382 :答：三、setTimeout详解 var t=setTimeout("javascript 语句",时间参数)注：时间参数单位为毫秒 示例：var t=setTimeout("alert('3 seconds!')",3000)如果js语句带变量，则必须用+号将变量连接起来，如：var t=set...
祁柿呼3382 :答：你的程序可以改成：function navbar(className){ var nav=document.getElementById("nav");nav.className = nav.className=="navbar"?"tnavbar":"navbar";} 以下我刚刚写的测试程序，证明上面的.className换class是没...
祁柿呼3382 :答：< input type="button" value="命名空间使用" onclick="t.$();"/> < script type="text/javascript"> (function namespace(){ this.$=function(){ alert(‘命名空间使用！’);} window.t ={};window.t=this;...
祁柿呼3382 :答：var s=1 , m=2;// 根据长度来判断var strS=s.toString() , strM=m.toString();if(strS.length<2) strS='0'+strS;if(strM.length<2) strM='0'+strM;
祁柿呼3382 :答： function edit1(o){ o.style.display="none";form1.s.value=o.innerHTML;document.getElementById("t_edit").style.display="block";} function submit1(){ form1.submit();} ...
祁柿呼3382 :答：TINV 返回 t 值，P(|X| > t) = probability，其中 X 为服从 t 分布的随机变量，且 P(|X| > t) = P(X < -t or X > t)。单尾 t 值可通过用两倍概率替换概率而求得。如果概率为 0.05 而自由度为 10...
祁柿呼3382 :答： var searchobj = new Object;var rng = new Object;searchobj.row = -1;searchobj.col = -1;function searchclick(){ findText2("test",txtFind.value);} function findText2(tabname,str){ var tab = documen...
祁柿呼3382 :答：下面是关键代码，如果剩下的你都搞不懂，我就无语了 JS function reloadcodeOne(){//刷新验证码函数 var verify = document.getElementById('checkCodeImg');verify.setAttribute('src', 'validateCode?dt=' + Math...
祁柿呼3382 :答：延迟出口弹出，最简单方法就是用js里的setTimeout方法，下面是一个简单的例子：<div id="div" style="width:100px; height:100px; background:#ccc; display:none;"var oDiv = document.getElementById('div');var...
祁柿呼3382 :答： var t=0; window.ondblclick=function(){ if(t){ clearInterval(t); t=0; }else{ t=setInterval(function(){ scrollBy(0,5); //每次滚动5像素 },50); //每次滚动时间间隔50...
