荷兰网站blendle

时间:2014-05-10 10:08:47

标签: jquery html css twitter-bootstrap

在荷兰,我们有这项名为“Blendle'”的新服务。我对横向滚动背后使用的技术感到好奇。让我详细说明一下。

如果您在台式机,笔记本电脑或平板电脑上访问其网站,则滚动会转换为横向滚动。他们是怎么做到的? 此外,如果您在智能手机上访问他们的网站,他们的网页突然不再向侧面滚动,而是滚动垂直。他们是如何改变的?他们使用bootstrap吗?

你有什么看法?

2 个答案:

答案 0 :(得分:0)

横向滚动:jquery animate http://api.jquery.com/animate/

至于移动版和桌面版之间的差异,您可以使用mediaqueries(css)定义它们。

谷歌,你会发现很多:)

编辑:我不知道是否可以在stackoverflow上进行PM,但如果是,请执行。我也是荷兰人,我想我可以用我们的母语解释更多内容; p

答案 1 :(得分:0)

虽然Blendle可能使用了一些Bootstrap插件或函数,但我知道用jQuery和 jQuery Mousewheel plugin 来实现这一目的。

首先加载jQuery和插件。

然后使用以下代码启动(请注意,您可能希望替换$('.container')以与您的包含元素对应。如果您没有容器,请放置$('html,body')

<script>
(function($){
    $('.container').on('mousewheel', function(event,delta){
        this.scrollLeft -= (delta * 30);
        event.preventDefault();
    });
})(jQuery);
</script>