Wordpress中垂直滚动溢出div

我想要让div在我的Wordpress安装中通过一些li元素垂直滚动 - 我是一个认真的业余爱好者，但是在阅读完jQuery/javascript后论坛整天在这里，我想我会检查并看看有经验的人是否可以帮助我。Wordpress中垂直滚动溢出div

我发现了很多很棒的解决方案，但它们中的每一个似乎都与另一个jQuery或JavaScript实例冲突。

理想情况下，我想要悬停时可以滚动的东西，但我会选择按钮，甚至只是简单地隐藏丑陋的滚动条。

我正在浏览的网页是在这里：http://ryanlinstrom.com/sandbox/vimeo-test/

我在页面上使用下面的脚本 - 如果有任何的方式来整合，使我的#thumbs DIV可以在不添加另一个脚本的滚动那会很棒。

 var apiEndpoint = 'http://vimeo.com/api/v2/'; 
    var oEmbedEndpoint = 'http://vimeo.com/api/oembed.json' 
    var oEmbedCallback = 'switchVideo'; 
    var videosCallback = 'setupGallery'; 
    var vimeoUsername = 'user677763'; 

    // Get the user's videos 
    $(document).ready(function() { 
     $.getScript(apiEndpoint + vimeoUsername + '/videos.json?callback=' + videosCallback); 
    }); 

    function getVideo(url) { 
     $.getScript(oEmbedEndpoint + '?url=' + url + '&width=780&height=435&callback=' + oEmbedCallback); 
    } 

    function setupGallery(videos) { 

     // Sets the video title 
     $('#stats h2').text(videos[0].title); 

     // Load the first video 
     getVideo(videos[0].url); 


     // Add the videos to the gallery 
     for (var i = 0; i < videos.length; i++) { 
      var html = '<li><a href="' + videos[i].url + '" name="'+ videos[i].title +'"><img src="' + videos[i].thumbnail_medium + '" class="thumb" />'; 
      html += '</a><p>' + videos[i].title + '</p></li>'; 
      $('#thumbs ul').append(html); 
     } 


     // Switch to the video when a thumbnail is clicked 
     $('#thumbs a').click(function(event) { 
      event.preventDefault(); 
      getVideo(this.href); 
      $('#stats h2').detach(); 
      var title = $(this).attr("name"); 
      $('#stats').append('<h2></h2>'); 
      $("#stats h2").text(title); 

      return false; 
     }); 

    } 

    function switchVideo(video) { 
     $('#embed').html(unescape(video.html)); 
    }

来源

2012-06-03 user1433097

我建议使用两个覆盖不可见的div（顶部一个，底部一个）。

然后做这样的事情：

$(".top-scroll").bind("mouseover", function(){ 
    $(".wrapping-div").animate({scrollTop: -= 5}, 100) 
}); 

$(".bottom-scroll").bind("mouseover", function(){ 
    $(".wrapping-div").animate({scrollTop: += 5}, 100); 
});

然后，当然，加入overflow:hidden你的CSS删除滚动条。

来源

2012-06-03 03:07:32 ahren

Wordpress中垂直滚动溢出div

回答

相关问题