在WordPress 加载 jQuery

Posted in: Wordpress

使用 jQuery 可以通过很简单的代码实现一些非常实用的效果,如:网页中双击滚屏、评论双击可编辑、一些好看的弹出层等等.例如我wordpress文章右中侧的这个向上向下就是利用jQuery实现的,很酷是吧?

什么是 jQuery?

简单的说 jQuery 就是 Javascript 框架,使用 jQuery 的宗旨就是写更少的代码,做更多的事情。在 WordPress 中合理的运用 jQuery,可以实现很多实用的效果。

如何在 WordPress 中使用 jQuery?

1.首先要加载 jQuery 库

这步很简单,你只需要在你使用的 WordPress 主题的 header.php 文件的 head 标签中加入如下代码即可:

1
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

你也可以把 google 上的 jQuery 库下载到本地再加载点击这里下载最新版
下载过来后你可以放到你的WWW目录下,然后在你使用的 WordPress 主题的 header.php 文件的 head 标签中加入如下代码即可

1
<script type="text/javascript" src="http://yourURL/jquery.min.js"></script>

2.在主题中调用 .js 文件
新建立一个 .js 文件,在文件中加入如下代码:

1
2
3
jQuery(document).ready(function($){
// 这里就是你需要添加的教程中提到的一些 jQuery 代码
});

如林木木返回顶部标签里面的JS文件是这样写的:

1
2
3
4
jQuery(document).ready(function($){
  $('#shang').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);});
  $('#xia').click(function(){$('html,body').animate({scrollTop:$('#footer').offset().top}, 800);});
});

最后在主题中调用这个 .js 文件,假设你建立的文件名为 all.js,那么直接在主题文件 header.php 中的 head 区域添加如下样式代码即可:

1
<script type="text/javascript" src="http://www.yourdomain/all.js"></script>

通过以上的操作你已经可以在 WordPress 中使用 jQuery 了
本方法来自园子博客:http://www.yzznl.cn/archives/jquery-in-wordpress.html

分享到:

热门文章-HOT

  1. Pingback: wordpress中利用jQuery实现向上向下滑动 — YESURE技术博客

无觅相关文章插件,快速提升流量

.