分享各种网络资源
是我乃至整个互联网的精髓所在
 您目前所在位置: 站点首页 » WordPress » 代码 » WordPress 链接鼠标悬停右移效果
+

WordPress 链接鼠标悬停右移效果

【文章目录】

WordPress 链接鼠标悬停右移效果-BanYuner

内容来源

内容来源:http://www.timle.cn/wordpress-link-move.html

实践过程

一开始看到这个的时候,就是想尝试一下,看看是什么样子的,虽然看了演示图,但是感觉自己不实践一下是不知道什么情况的,于是我的体验之路就开始了.本来是很简单的两段代码,一个是通过CSS来加载的,一个是通过js来加载的,根据原作者说的,js的要比css的顺滑不少,于是乎,我就选择了js代码进行尝试了,可是问题来了,文章作者并没有说代码添加到哪里,对于我这个小白,我有点混乱了,代码虽好,但是你不告诉我添加到哪里,这怎么搞

折腾过程

于是我就开始折腾了,首先观察代码,开始的头部jQuery这个关键词,于是我找到了include目录下,有个js的目录,正好有这么一个单独的文件,但是添加到文件中的哪个部分呢,我还是不知道,于是我就不断尝试,头部,中间,尾部,均无果,后来百度了一下为什么添加js代码没有效果,有一篇文章说是因为$符号的问题,要替换这个符号为jQuery,于是乎,我也进行替换了,还是没有效果.自尝试了很多次自后,我放弃了,想着这段代码方正也是很少,作用并不是很大,就直接保存书签不管了

峰回路转

今天回家之后,又打开了这个书签,简单的看了一下,然后灵光一闪,是不是根本就不应该添加到那个文件中呢,这个效果是实现归档页面右移的作用的,那么应该是基于归档页面的代码啊.就这样,我开始操作了,FTP下载了归档页面的文件,开始找,找到了一个script,我把代码尝试性的丢在这个之前,覆盖站点文件,刷新网页,有效果了.就这样,这个代码被我利用起来了

总结

首先根据这个情况,我个人总结出几个问题:
一:代码这个东西是很神奇的,添加的位置不一样或者不对,要么没效果,要么就是排版乱了
二:在不知道代码应该添加到哪里的情况下,我们可以进行不断尝试,但是一定要做好文件的备份工作
三:有时候,如果一个事情你无法解决并不是你的智商或者能力问题,可能是有一定的运气以及你的脑袋瓜子是不是发热的问题

实现功能

这里我就附上代码,大家可以自己尝试一下:

jQuery(document).ready(function($){
    $('.archives a').hover(function() {
    /*.archives a 改成你标题的样式名称,可以应用多个链接,用英文逗号隔开*/
    $(this).stop().animate({'marginLeft': '10px'}, 200);}, function() {
    $(this).stop().animate({'marginLeft': '0px'}, 200);
    });
});
关注我们 打赏 分享此文
微信扫码,关注我们
扫码,支持我
WordPress 链接鼠标悬停右移效果
支付宝(点击图片切换)
扫码,支持我
WordPress 链接鼠标悬停右移效果
微信(点击图片切换)
扫码,手机看
WordPress 链接鼠标悬停右移效果

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

 相关推荐

换一批 换一批
  • WordPress 评论中嵌入图片

    WordPress 评论中嵌入图片

    今天在知更鸟博客看到了这篇文章,虽然文章本身的原理很简单,但是通过这个原理我相信可以了解到信息或者说可以达到举一反三 ...

    点击查看
  • WordPress搜索只显示标题中含有关键字的文章

    WordPress搜索只显示标题中含有关键字的文章

    今天在知更鸟博客上面看到了这篇文章,整体来说,这个功能在某些方面还是比较有用的,如果说通过标题中的关键字来寻找文章的 ...

    点击查看
  • 如何给WordPress站点添加wow.js效果

    如何给WordPress站点添加wow.js效果

    今天折腾了以下这个东西,为什么会折腾这个东西呢,因为之前经常逛知更鸟博客,后来一次更新之后,发现知更鸟博客多了一种加 ...

    点击查看
  • 如何在WordPress评论中显示更多HTML标签

    如何在WordPress评论中显示更多HTML标签

    我见过很多站点,都可以在评论里面添加各种标签,什么自己加粗,然后添加图片,添加链接等等,当时我个人觉得可能并不适合我 ...

    点击查看
  • WordPress显示一年前当天的文章

    WordPress显示一年前当天的文章

    最开始看到这个功能是在112博客,那个时候看到这个功能的第一感觉可能就是觉得,这个功能不是很实用,可能会增加SQL语句的查 ...

    点击查看
  • 给你的WordPress站点添加一个打印按钮

    给你的WordPress站点添加一个打印按钮

    这个功能很久之前就已经在知更鸟博客上面看到了,但是一直没有想过是什么原理,但是今天无意间发现了一个方法,目前觉得还是 ...

    点击查看
  • WordPress显示一周热评

    WordPress显示一周热评

    WordPress站点如何显示一周热评,我相信还是有很多人都想要知道的,那么这里就简单的说说实现方法了。

    点击查看
  • WordPress 限定显示评论者链接的输出

    WordPress 限定显示评论者链接的输出

    最近从bigfa的相关站点看到了这个更新内容,我个人觉得还是很有用的,对于一些广告用户还是有一定的作用的,毕竟有些时候, ...

    点击查看
  • WordPress文章段落间插入广告

    WordPress文章段落间插入广告

    很久之前就已经在留意这个功能了,但是一直没有找到相关的解决办法,今天我算是找到了这个相关代码。使用这个功能对于我们宣 ...

    点击查看
  • 最轻便的复制页面内容到剪切板的JS:clipboard.js

    最轻便的复制页面内容到剪切板的JS:clipboard.js

    今天早些时候在水煮鱼博客看到了这篇文章,我一开始是想要用到代码方面的,毕竟代码很多时候都是直接复制编辑的,但是后来想 ...

    点击查看
  • WordPress前台显示站点有多少注册用户

    WordPress前台显示站点有多少注册用户

    虽然我的站点目前已经关闭了注册,所有已经注册过的用户已经清理完毕了,这里说声抱歉。那么今天这个文章就是给大家一个方法 ...

    点击查看
  • WordPress添加一个底部漂浮栏

    WordPress添加一个底部漂浮栏

    站点底部添加一个通知栏的作用是起到一个通知或者说增加PV的作用,但是很多时候我们都知道,这种通知可能被人觉得很反感,但 ...

    点击查看

  目前有 2 条评论 其中:访客: 1 条, 博主: 1 条

WordPress 链接鼠标悬停右移效果
评分: 9 + 8 =
  • 昵称 (必填)  
  • 邮箱 (必填)
  • 网址 (选填)
  1. 1楼
    $('.archives a').hover(function() 改为: $('.archives a,.widget, .widget a,.entry-title a').hover(function() 试试,记得把js代码添加到全局js里面。
    Timle.CN 来自天朝的朋友 谷歌浏览器 Windows 10 四川省成都市 电信 1年前 (2015-10-17)回复
    • 这样的话,很多地方都可以位移了,效果更佳 :lol:
      帅气小琦琦   来自天朝的朋友 谷歌浏览器 Windows 10 湖北省武汉市 电信 1年前 (2015-10-17)回复