网站特效-------旋转的图片
由于近期工作中和個人需要做些網(wǎng)站，原本沒有接觸過web開發(fā)的我，這段時間發(fā)現(xiàn)web開發(fā)原來這么奇妙！
現(xiàn)在貼出旋轉(zhuǎn)圖片的特效，供大家學(xué)習(xí)！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>
tt
</title>
<style type="text/css">
body{background:black}
#p1{position:absolute;height:75px;top:200px;}
</style>
<script type="text/javascript">
var left=200;
var img=document.getElementById('p1');
var imgWidth=286;
var pi=Math.PI;
var x=0,temp=0;
function init(){
document.getElementById('p1').style.left=left+'px';
var set=setInterval('goOn()',40);
}
function goOn(){
temp=Math.cos(x);
document.getElementById('p1').style.width=Math.abs(imgWidth*temp)+'px';
document.getElementById('p1').style.left=(left+(imgWidth-Math.abs(imgWidth*temp/2)))+'px';
if(temp<0){
document.getElementById('p1').style.filter='FlipH(enabled:true)';
}else{
document.getElementById('p1').style.filter='FlipH(enabled:false)';
}
x+=pi/90;
}
</script>
</head>
<body >
<div id="imground">
<img id="p1" src=/teixiao/UploadFiles_4612/200907/20090731103036423.gif alt="網(wǎng)頁吧"/>
</div>
<script type="text/javascript">init();</script>
</body>
</html>
利用腳本語言可以使你的頁面更加精彩，在學(xué)校有好多東西需要在工作中學(xué)，工作中常常會遇到之前沒學(xué)過的，
需要我們利用網(wǎng)絡(luò)、圖書等手段去不斷學(xué)習(xí)解決問題，可不要說沒學(xué)過了事。呵呵。
《新程序員》：云原生和全面數(shù)字化實踐50位技術(shù)專家共同創(chuàng)作，文字、視頻、音頻交互閱讀總結(jié)
以上是生活随笔為你收集整理的网站特效-------旋转的图片的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 在网页中显示数字时钟
- 下一篇： Shell Sort 希尔排序 收藏