没什么好更新,分享下这个吧,这个是凉心给我的!他现在用的模板在出售,有兴趣的去看看吧!
先来预览下那个东东吧。
效果看看我模板的左边就行了!
至于怎么用,大家看下面吧,为了避免出错,大家还是先备份好文件吧~~
用到三个文件header.php\footer.php\style.css (必须是你所用主题的三个文件)
1.先把下面的代码加到style.css里面!
强调:img/ad.png 是你图片的位置,比方说你的模板用个图片的文件夹,就把ad.png放到文件夹里面,然后把img改成文件夹的名称!
ad.png就把上面预览的图片另存为就好了~
查看源代码
打印帮助
1 /* ad start*/
2
3 #adbg{ position:absolute;left:-203px; top:150px; background:url(img/ad.png) no-repeat; width:235px; height:231px;position:fixed;}
4
5 #ad{ width:180px; height:150px;margin:62px 0 0 9px;position:fixed;}
6
7 /* ad END */
2.在header.php里面加下面一段代码~
查看源代码
打印帮助
01 <script type=”text/javascript” >
02
03 jQuery(document).ready(function($){
04
05 $(“#adbg”).hover(
06
07 <span style=”white-space: pre;”> </span>
08
09 <span style=”white-space: pre;”> </span>function() {<span style=”white-space: pre;”> </span>
10
11 <span style=”white-space: pre;”> </span> // 鼠标悬停时候被触发的函数
12
13 <span style=”white-space: pre;”> </span> $(this).stop().animate({‘left’:'+=200px’},250);//藏
14
15 <span style=”white-space: pre;”> </span> },
16
17 <span style=”white-space: pre;”> </span> function() {
18
19 <span style=”white-space: pre;”> </span> // 鼠标移出时候被触发的函数
20
21 <span style=”white-space: pre;”> </span> $(this).stop().animate({‘left’:'-200px’},250); //上滑至显示
22
23 <span style=”white-space: pre;”> </span>});
24
25 });
26
27 </script>
3.将下列代码放到footer.php中 适当位置,别乱放~放在<?php wp_footer(); ?>前面~自己研究吧~
查看源代码
打印帮助
1 <span style=”font-size: 10pt; color: #000000;”><div id=”adbg”>
2 <div id=”ad”>
3 </span><span style=”font-size: 10pt; color: #000000;”>
4 广告代码放在这里
5 </div>
就到这里咯~~
转载自JCBoy’S Blog
