|
|奔日网技术学堂欢迎您
tech.8BR.NET|
当我们点击网页上的链接时,浏览器页面就会转到链接指向的新的页面,我们想在页面转换时加上过渡效果。
打开这个页面的原代码,在<head>与</head>插入代码: <meta http-equiv="Page-Exit" content="revealTrans(Duration=3,Transition=5)">
这样这个过渡效果就完成了,很简单吧。现在我们来测试一下效果如何,打开这个页面,然后点击页面上的链接,页面在转到下一个页面的过程中,我们看到页面是从上到下慢慢的转换到第二个页面的。
我们现在再试一个效果,将那段代码换成: <meta http-equiv="Page-Exit" content="revealTrans(Duration=1,Transition=14)">
我们看到页面是从中间向左右两端展开过渡的,而且速度上快了一点。原因在于Duration和Transition的值不同。Duration的值为网页动态过渡的时间,单位为秒。
Transition是过渡方式,它的值为0到23,分别对应24种过渡方式。如下表:0 盒状收缩 1 盒状放射 2 圆形收缩 3 圆形放射 4 由下往上 5 由上往下 6 从左至右 7 从右至左 8 垂直百叶窗 9 水平百叶窗 10 水平格状百叶窗 11垂直格状百叶窗 12 随意溶解 13从左右两端向中间展开 14从中间向左右两端展开 15从上下两端向中间展开 16从中间向上下两端展开 17 从右上角向左下角展开 18 从右下角向左上角展开 19 从左上角向右下角展开 20 从左下角向右上角展开 21 水平线状展开 22 垂直线状展开 23 随机产生一种过渡方式
当Transition为23时,会随机产生0到22中的一个过渡效果。例如:<meta http-equiv="Page-Exit" content="revealTrans(Duration=2,Transition=23)">
除了上面两个参数,还有一个http-equiv:http-equiv="Page-Exit"的意思是指页面离开时产生效果。 它有一种写法,如:http-equiv="Page-Enter"则是指页面进入时产生的效果。
|
发表对
实现网页转换特殊过渡效果
的评论 请文明聊天 |
|点此可收藏|或发表对本篇的评论
|