myway 发表于 2007-4-27 11:01:04

***链接特效***有没有看过会旋转的链接? 请看...... (爽啊。)

把下列代码加到网页的<body></body>标签之间 从google下载我的照片管理软件
要完成此效果需要两个步骤

第一步:把如下代码加入到<head>区域中

<style>
.fly {
color:          336c6c;
font-family:    arial;
font-size:      24px;
position:       absolute;
visibility:   hidden;
z-index:      2;
}

.logo {
font-family:    times;
font-size:      48px;

color:          blue;
position:       absolute;
top:            0px;
left:         70px;
visibility:   visible;
z-index:      1;
}

.desc {
text-align:   center;
font-family:    楷体_gb2312;
font-size:      18px;
color:          #336c6c;
position:       absolute;
top:            220px;
left:         140px;
width:          400px;
visibility:   hidden;
z-index:      0;
}

body {
background:   #c0c0c0;
}

a {
color:          lime;
}

a:hover {
    color : yellow;
   
}
</style>
<script language="javascript">
    ns4 = (document.layers)? true:false
    ie4 = (document.all)? true:false

function showobject(obj) {
    if (ns4) obj.visibility = "show"
    else if (ie4) obj.visibility = "visible"
    }

function hideobject(obj) {
    if (ns4) obj.visibility = "hide"
    else if (ie4) obj.visibility = "hidden"
    }

function slidelogo(from, to) {
            if (from < to) {
                company.top = (from += 10);
                settimeout('slidelogo(' + from + ',' + to + ')', 20);
            }
            else initobjects();
    }


function rotateobjects() {
            for (var i = 0; i < pos.length; i++) {
                pos += inc; objects.visibility = 'visible';
                objects.left = (r * math.cos(pos)) + xoff
                objects.top = (r * math.sin(pos)) + yoff;
            }
      rotatetimer = settimeout("rotateobjects()", 50);
    }


function initobjects() {

      objects = new array(fly1, fly2, fly3, fly4);
      pos = new array();
      pos = 0;
            for (var i = 1; i < objects.length; i++) {
                pos = parsefloat(pos + ((2 * pi) / objects.length));
            }
      rotateobjects();
    }

/* variables for rotating objects */
    var objects;
    var pos;
    var r = 160;      // radius
    var xoff = 280;   // x offset
    var yoff = 170;   // y offset
    var pi = math.pi;   // get pi
    var inc = pi / 180; // degrees per rotation cycle
    var objects;      // objects to be rotated
    var pos;            // position for objects


</script>


第二步:把如下代码加入到<body>区域中

<div id="fly1" class="fly"><p>

<a href="#" onmouseover="showobject(desc1)"
onmouseout="hideobject(desc1)">link 1</a><br>
</p>
</div><div id="fly2" class="fly"><p>

<a href="#" onmouseover="showobject(desc2)"
onmouseout="hideobject(desc2)">link 2</a><br>
</p>
</div><div id="fly3" class="fly"><p>

<a href="#" onmouseover="showobject(desc3)"
onmouseout="hideobject(desc3)">link 3</a><br>
</p>
</div><div id="fly4" class="fly"><p>

<a href="#" onmouseover="showobject(desc4)"
onmouseout="hideobject(desc4)">link 4</a><br>
</p>
</div><div id="company" class="logo">

<p><small>welcome to typhoon start</small></p>
</div><div id="desc1" class="desc">

<p>link 1的内容 </p>
</div><div id="desc2" class="desc">

<p>link 2的内容 </p>
</div><div id="desc3" class="desc">

<p>link 3的内容 </p>
</div><div id="desc4" class="desc">

<p>link 4的内容 </p>
</div><script language="javascript">
    /* simple version detection */
    var isns = (navigator.appname == "netscape" && parseint(navigator.appversion) >= 4);
/* they can be used in place
       of hidden and visible because on occasion navigator has problems with the two */
    var hidden = (isns) ? 'hide' : 'hidden';
    var visible = (isns) ? 'show' : 'visible';

    /* create shortcut variables for different absolutely positioned elements */
    var fly1 = (isns) ? document.fly1 : document.all.fly1.style;
    var fly2 = (isns) ? document.fly2 : document.all.fly2.style;
    var fly3 = (isns) ? document.fly3 : document.all.fly3.style;
    var fly4 = (isns) ? document.fly4 : document.all.fly4.style;
    var company = (isns) ? document.company : document.all.company.style;
    var desc1 = (isns) ? document.desc1 : document.all.desc1.style;
    var desc2 = (isns) ? document.desc2 : document.all.desc2.style;
    var desc3 = (isns) ? document.desc3 : document.all.desc3.style;
    var desc4 = (isns) ? document.desc4 : document.all.desc4.style;

    /* begin the sliding of the company logo */
    slidelogo(0, 140);
</script>
      











------------------------------- ----- --

拥有三人 行论坛管理系列软件,一个人就可以管理一个论坛的更 新维护。 还能使您的论坛有 千人在线的真实火暴效 果,让您不在为论坛因没有人气而留不住 会员而烦恼,使您的论坛早日成为一 流的论坛。详情请登陆网站:http://www.cnsrx.cn 三人行论坛管理软件,站长必备的专业好工具。(您使用的 是免费版本,购买收费版本后, 将不带广告 。业务QQ:2 47216 44985227)
页: [1]
查看完整版本: ***链接特效***有没有看过会旋转的链接? 请看...... (爽啊。)