分享各种网络资源
是我乃至整个互联网的精髓所在
 您目前所在位置: 站点首页 » WordPress » 代码 » WordPress添加页面过渡效果
+

WordPress添加页面过渡效果

WordPress添加页面过渡效果-BanYuner

WordPress添加页面过渡效果

最近比较关注WordPress方面的代码,所以更新的比较频繁,还请大家谅解。这次依然是来自知更鸟博客的代码,主要内容是为了页面提供一个过渡的动画,就像上面的。当然,图片方面大家可以自己修改,我是懒得改了,所以随便的弄了一下。

那么我就直接附上相关代码了:

引入JS

外链格式

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.3.min.js"></script>

外链格式中的js可以自己寻找更好的进行替换。

内链格式

<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.min.js" ></script>

添加JS代码

<script type="text/javascript">
jQuery(function(){
jQuery('#loading-one').empty().append('页面加载完毕.').parent().fadeOut('slow');
});</script>

上面的代码直接添加到之前即可。

添加效果代码

<div id="loading" style="position:fixed !important;position:absolute;top:0;left:0;height:100%; width:100%; z-index:999; background:#000 url(这里输入一个图片地址) no-repeat center; opacity:0.6; filter:alpha(opacity=60);font-size:14px;line-height:20px;" onclick="javascript:turnoff('loading')">
<p id="loading-one" style="color:#fff;position:absolute; top:50%; left:50%; margin:50px 0 0 -50px; padding:3px 10px;" onclick="javascript:turnoff('loading')">页面载入中,请稍后...</p>
</div>

其实这个功能还可以继续扩展一下,大家可以发挥自己的想象了。

关注我们 打赏 分享此文
微信扫码,关注我们
扫码,支持我
WordPress添加页面过渡效果
支付宝(点击图片切换)
扫码,支持我
WordPress添加页面过渡效果
微信(点击图片切换)
扫码,手机看
WordPress添加页面过渡效果
匿名

个人评价:┃草根博主┃站点无技术含量┃文章内容不够吸引人┃转载内容随处可见┃资源均来自网络┃分享是我的宗旨,也是这个站点存在意义,分享的东西你现在可能不需要,但是我相信只要在某个时间你需要的时候能在这里找到,那么我就是成功的

相关推荐

  • WordPress纯代码实现文章AJAX点赞

    WordPress纯代码实现文章AJAX点赞

    这个功能其实在很多主题中都集成进去了,DUX默认的主题里面也是有这个功能的,但是我将其删除了,之后换上了评星插件了,评 ...

    点击查看
  • WordPress页面(page)添加标签和分类功能

    WordPress页面(page)添加标签和分类功能

    WordPress页面(page)添加标签和分类功能 文章分类目录和标签功能是WordPress自带的功能,但是很多时候,喜欢使用页面的用 ...

    点击查看
  • 如何在WordPress文章中插入视频

    如何在WordPress文章中插入视频

    如何在WordPress文章中插入视频 现在很多站点都是做视频站点的,同时也有很多视频站点都是使用的CK播放器,如果你已经使用了 ...

    点击查看
WordPress添加页面过渡效果
5 + 7 =
  • 昵称 (必填)  
  • 邮箱 (必填)
  • 网址 (选填)