jquery - jQuery使用鼠标移动垂直移动元素并在鼠标悬停时选择文本

Question

我正在尝试通过共享歌词图像（按钮）来完全使用此网页。

http://www.metrolyrics.com/just-give-me-a-reason-lyrics-pink.html

我想在这里发生两件事：

1. 选择了一些行的文本并将其保存在某个变量中以供进一步使用。
2. 共享歌词图像随着鼠标垂直移动。

我知道这是 jQuery 的东西，但我是 jQuery 的新手。

完成了我所有的研究，但我无法找到适合我需要的合适的匹配。我也在 jQueryUI( http://jqueryui.com/position/ )上阅读了文档，但没有得到我想要的。

有人可以帮我吗？

帮助 这是我正在尝试使用的一个小代码，但悬停功能似乎不起作用。

函数追加文本（）

{

var txt1="文本。
"; // 用 HTML 创建文本

var txt2=$("
").text("Text."); // 使用 jQuery 创建文本

$("body").append(txt1,txt2); // 添加新元素

}

$('.line').hover(函数(){

   $('.line').removeClass('hover');

   $(this).addClass('hover');

});

Answer 1

它非常简单：

在该网站上，div当悬停时，它允许 jquery 将一个hover类插入该 div $().addClass('hover');（以及以下 3 个 div）。在 css 中它说divwith a hoverclassdiv.hover有另一个背景。

可以使用的代码：

$('.line').hover(function(){
   $('.line').removeClass('hover');
   $(this).addClass('hover').next().addClass('hover').next().addClass('hover').next().addClass('hover');
});

CSS：

.line.hover {
background-color: #3333FF; //some colllor
}

获取选定的文本：

 $('.hover').text()

或者

$('.hover').each(function(){ 
$(this).text();
}

将图像移动到第一个选定的 div：

$('.line').hover(function(){
   $('.line').removeClass('hover');
   $("#share-image").appendTo(this);
.appendTo("#destination");$(this).addClass('hover').next().addClass('hover').next().addClass('hover').next().addClass('hover');
});

Answer 2

看看这段代码，可能对第二个问题有帮助 http://jsfiddle.net/bPfgT

$('#menu').mousemove(function(my) {   
    var y = my.pageY - this.offsetTop;
    $('#follow').css({        
        'left': 0,
        'top': '' + y + 'px' 
    });
});