Kết quả 1 đến 2 của 2
  1. #1
    Moderator vudesign's Avatar
    Ngày tham gia
    23-01-2014
    Bài viết
    324
    Cảm ơn
    22
    Được cảm ơn 45 trong 39 bài viết

    Bác nào viết jquery cho hỏi về scrolling

    đây là code

    Code:
    <script>        (function($){
                $(window).load(function(){
                    $("#content_1").mCustomScrollbar({
                        scrollInertia:1500,
                        horizontalScroll:true,
                        mouseWheelPixels:700,
                        scrollButtons:{
                            enable:true,
                            scrollType:"pixels",
                            scrollAmount:300
                        },
                        callbacks:{
                            onScroll:function(){ snapScrollbar(); }
                        }
                    });
                    /* toggle buttons scroll type */
                    var content=$("#content_1");
                    $("a[rel='toggle-buttons-scroll-type']").html("<code>scrollType: \""+content.data("scrollButtons_scrollType")+"\"</code>");
                    $("a[rel='toggle-buttons-scroll-type']").click(function(e){
                        e.preventDefault();
                        var scrollType;
                        if(content.data("scrollButtons_scrollType")==="pixels"){
                            scrollType="continuous";
                        }else{
                            scrollType="pixels";
                        }
                        content.data({"scrollButtons_scrollType":scrollType}).mCustomScrollbar("update");
                        $(this).html("<code>scrollType: \""+content.data("scrollButtons_scrollType")+"\"</code>");
                    });
                    /* snap scrollbar fn */
                    var snapTo=[];
                    $("#content_1 .images_container img").each(function(){
                        var $this=$(this),thisX=$this.position().left;
                        snapTo.push(thisX);
                    });
                    function snapScrollbar(){
                        var posX=$("#content_1 .mCSB_container").position().left,closestX=findClosest(Math.abs(posX),snapTo);
                        $("#content_1").mCustomScrollbar("scrollTo",closestX,{scrollInertia:1000000000,callbacks:false});
                    }
                    function findClosest(num,arr){
                        var curr=arr[0];
                        var diff=Math.abs(num-curr);
                        for(var val=0; val<arr.length; val++){
                            var newdiff=Math.abs(num-arr[val]);
                            if(newdiff<diff){
                                diff=newdiff;
                                curr=arr[val];
                            }
                        }
                        return curr;
                    }
                });
            })(jQuery);
            
        </script>
    Trường hợp này lăng chuột thì content sẽ chạy từ phải qua trái. bây giờ mình muốn thêm chức năng key board up - dow thì làm như thế nào . ví dụ nhấn up or dow thì scroll sẽ di chuyển mà không cần mouse.

    link dây : http://zinfun.com/
    Sửa lần cuối bởi vudesign; 07-04-2014 lúc 10:29 AM.

  2. #2
    CI Member anh2haui's Avatar
    Ngày tham gia
    20-12-2013
    Bài viết
    29
    Cảm ơn
    10
    Được cảm ơn 4 trong 3 bài viết

Chia sẽ và Bình Luận chủ đề Bác nào viết jquery cho hỏi về scrolling trên facebook

Các Chủ đề tương tự

  1. Help các event trong jquery???
    Bởi hongkong trong diễn đàn HTML, CSS, JS & Jquery
    Trả lời: 0
    Bài cuối: 28-04-2014, 01:59 PM
  2. Chọn hết checkbox rồi xóa sử dụng jquery???
    Bởi hongkong trong diễn đàn Hỏi đáp
    Trả lời: 6
    Bài cuối: 28-04-2014, 01:45 PM
  3. Bác nào rành về html5 vs jquery vào giúp tớ với
    Bởi binkutehehe trong diễn đàn Hỏi đáp
    Trả lời: 2
    Bài cuối: 15-12-2013, 04:49 PM
  4. chosen jquery
    Bởi timhieu trong diễn đàn HTML, CSS, JS & Jquery
    Trả lời: 5
    Bài cuối: 05-09-2013, 10:07 AM
  5. jQuery Plugin Google Map
    Bởi 2webvn.com trong diễn đàn HTML, CSS, JS & Jquery
    Trả lời: 1
    Bài cuối: 28-06-2013, 09:27 AM

Các từ khóa xuất hiện trên google của chủ đề

Chưa có từ khóa lên top google

Tag của Chủ đề này - Hãy Thêm Tags Để bài viết nhanh lên top google

Quyền viết bài

  • Bạn không thể đăng chủ đề mới
  • Bạn không thể gửi trả lời
  • Bạn không thể gửi đính kèm
  • Bạn không thể sửa bài
  •