小编gsl*_*tte的帖子

在悬停时附加文本链接标题?

所以我正在我的投资组合网站上工作.其中一个列有四个div,每个div都有一个内部按钮(),通向另一个页面(Resume,Portfolio,Contact等).我想弄清楚的是如何使用{和}创建一个排序选择器.我真的很喜欢每个链接周围的括号外观,例如当你将鼠标悬停在Resume上时,它会从Resume更改为{Resume}.我已经搞乱了一段时间的CSS并且在颜色上获得了很好的1s转换,但是我不知道如何让我的选择器的想法发挥作用.我一直在尝试使用JS/jQuery在悬停时为每个添加{和},但我似乎无法使它工作.我的JS绝对是初学者,我没有看到谷歌搜索中有任何帮助.

这是相关列的代码:

<div class="col-xs-12 col-sm-3 col-lg-4">
           <div class="resume button links marginTop"><a href="resume.html" class="btn">Resume</a></div>
           <div class="portfolio links button"> <a href="portfolio.html" class="btn">Portfolio</a></div>
           <div class="photography links button"><a href="photography.html" class="btn">Photography</a></div>
           <div class="contact links button"><a href="mailto:me@me.me" class="btn">Contact</a></div>
        </div>
Run Code Online (Sandbox Code Playgroud)

我的JS:

$(function() {
$('.links').hover(function(){
    var text = (this).text();
    $(this).text = "{ " + text + " }";
});});
Run Code Online (Sandbox Code Playgroud)

我确定我搞乱了HTML或JS(或两者兼而有之),但我似乎无法搞清楚.任何帮助都会很棒!

PS:我在问,我应该使用列表(UL?)作为我的链接与单独的div,就像我目前在列中一样?链接是垂直方向的.

html javascript css jquery hover

0
推荐指数
1
解决办法
767
查看次数

标签 统计

css ×1

hover ×1

html ×1

javascript ×1

jquery ×1