wordpress技巧-jquery slide panel效果
Jul 18, 2008 JQUERY, Wordpress技巧
Tags: JQUERY, Wordpress技巧-Skills
Simple Slide Panel
先来看下demo
它是怎么实现的呢?
1. 下载一个slide panel文件包
2. 解压后把包里的文件上传到/wp-content/themes/你的主题/你所存放的文件夹
3.在</title>后和</head>前加入以下代码：
<script type=“text/javascript” src=“你文件所存放的目录/ jquery.js”></script> <script type=“text/javascript”> $(document).ready(function(){ $(”.btn-slide”).click(function(){ $(”#panel”).slideToggle(”slow”); $(this).toggleClass(”active”); return false; }); }); </script> <link rel=“stylesheet” href=“你文件所存放的目录/slidepanel.css” type=“text/css” media=“all” />
4.然后再在<body>后加入以下代码：
<div id=“panel”> –内容添加到这里– </div> <p class=“slide”><a href=“#” class=“btn-slide”>Slide Panel</a></p>
次文写的比较踌躇，没仔细检查过，如果有发现什么问题欢迎和我联系
转载原创文章请注明，转载自：Thinkboke[http://thinkboke.com]
本文链接: http://thinkboke.com/archives/26
如果你喜欢这篇文章,你可以点击以下按钮,收藏和推荐此文章
Leave a Reply