jquery - グラグラ jQuery サムネイル スクローラー CSS

Question

私はサムネイル スクローラーに取り組んでいます: https://dl.dropbox.com/u/2241201/jquery-thumbnail-scroll/index.html

サムネイルの上にマウスを置くと、左から右にぐらつきます。

私はすべてを試したように感じますが、画像のサムネイルが不安定に見えるのを防ぐことはできません.

これは CSS の問題だと思います。デフォルトのスクローラーは小さく、揺れませんでした。

Answer 1

これは Css の問題ではなく、.jTscrollerのleftプロパティを変更する JavaScript の問題です。

コードは

$this.mousemove(function(e){
    mouseCoords=(e.pageX-pos[1]);
    mouseCoordsY=(e.pageY-pos[0]);
    var mousePercentX=mouseCoords/$this.width(); if(mousePercentX>1){mousePercentX=1;}
    var mousePercentY=mouseCoordsY/$this.height(); if(mousePercentY>1){mousePercentY=1;}
    var destX=Math.round(-((totalWidth-$this.width())*(mousePercentX)));
    var destY=Math.round(-((totalHeight-$this.height())*(mousePercentY)));
    $scroller.stop(true,false).animate({left:destX,top:destY},options.scrollEasingAmount,options.scrollEasing); 
});

使用する

$this.mousemove(function(e){
    var obj=new Object();
    if(options.scrollerOrientation=="horizontal"){
        mouseCoords=(e.pageX-pos[1]);
        var mousePercentX=mouseCoords/$this.width(); if(mousePercentX>1){mousePercentX=1;}
        var destX=Math.round(-((totalWidth-$this.width())*(mousePercentX)));
        obj.left=destX;
    }else{
        mouseCoordsY=(e.pageY-pos[0]);
        var mousePercentY=mouseCoordsY/$this.height(); if(mousePercentY>1){mousePercentY=1;}
        var destY=Math.round(-((totalHeight-$this.height())*(mousePercentY)));
        obj.top=destY;
    }
    $scroller.stop(true,false).animate(obj,options.scrollEasingAmount,options.scrollEasing); 
});

こちらをご覧ください：http://jsfiddle.net/rUCXg/2/