Question

我的横幅中使用了一些bootstrap glyphicons。

我正在寻找的是按照鼠标在我的横幅内移动来向左或向右移动图标。

像这样的东西 “http://stephband.info/jparallax/”。

我尝试使用此代码

$(document).ready(function(){
    $('#banner .sl-slide').mousemove(function(e){
        var x = (e.pageX * -1 / 6);
        $('.flyInLeft').css('left',(0-(x*.25))+'px');
    });   
});

但是当我移动鼠标时，所有元素都会向左移动并移动到那里。

感谢您的帮助：）

Answer 1

感谢大家的努力，但我找到了解决方案。

这是我正在寻找的代码。

    $('#banner .sl-slide').mousemove(function(e){
        var x = (e.pageX * -1 / 6);
        var y = (e.pageY * -1 / 6);

        $('.flyInLeft').css('marginLeft',(0-(x*.25))+'px');
        $('.flyInRight').css('marginRight',(0-(x*.25))+'px');
        $('.flyInLeft, .flyInRight').css('marginTop',-(0-(y*.25))+'px');

    });   

    $('.banner').mouseleave(function(e){
        $('.flyInLeft, .flyInRight').animate({'margin': 0}, 1000);
    });

对跨度标签的视差效果

1 个答案: