个人中心
文章发布
退出
作者热门文章
- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
25
4
我上次问this kind of question ，但我没有从这些答案中找到更好的解决方案。
我试过了。当滚动位置到达 te 点 500 到 600 时，以前的 div 标签从我的容器中分离出来，新的 div 标签附加在右侧。
但是在 block 删除、附加和左位置更改之后，我对容器的 scrollLeft 有一个问题。在我的脚本中，在出现闪烁的 scrolleft:100 点强制滚动到左侧。强制滚动到左侧时如何停止闪烁。？ jsfiddle
最佳答案
很难从你的问题中准确判断出你在寻找什么。我假设你想要一个带有延迟加载图像的无限水平滚动。
我认为没有理由删除图像，除非您不想滚动回它们。如果您不知道初始图像宽度，您可以在滚动时动态更改滚动条的宽度，但您还需要调整滚动位置。
这是一个代码片段来说明:
$(function() {
var scrollContainer = $("#container");
var scrollContents = $("#scroll-contents");
var colors = ['rgba(143, 146, 199, 0.49)', 'rgba(199, 143, 186, 0.49)', 'rgba(149, 199, 143, 0.49)', 'rgba(229, 86, 61, 0.49)',
'rgba(212, 229, 61, 0.49)', 'rgba(206, 61, 229, 0.49)', 'rgba(229, 157, 61, 0.49)', 'rgba(61, 165, 229, 0.49)', 'rgba(61, 229, 133, 0.49)',
'rgba(229, 61, 61, 0.49)', 'rgba(116, 61, 229, 0.49', 'rgba(218, 229, 61, 0.49)', 'rgba(21, 43, 157, 0.49)', 'rgba(153, 157, 21, 0.49)', 'rgba(199, 143, 186, 0.49)',
'rgba(149, 199, 143, 0.49)', 'rgba(229, 86, 61, 0.49)', 'rgba(212, 229, 61, 0.49)', 'rgba(206, 61, 229, 0.49)', 'rgba(229, 157, 61, 0.49)', 'rgba(61, 165, 229, 0.49)',
'rgba(61, 229, 133, 0.49)', 'rgba(229, 61, 61, 0.49)', 'rgba(116, 61, 229, 0.49', 'rgba(218, 229, 61, 0.49)', 'rgba(21, 43, 157, 0.49)', 'rgba(153, 157, 21, 0.49)',
'rgba(199, 143, 186, 0.49)', 'rgba(149, 199, 143, 0.49)', 'rgba(143, 146, 199, 0.49)', 'rgba(199, 143, 186, 0.49)', 'rgba(149, 199, 143, 0.49)', 'rgba(229, 86, 61, 0.49)',
'rgba(212, 229, 61, 0.49)', 'rgba(206, 61, 229, 0.49)', 'rgba(229, 157, 61, 0.49)', 'rgba(61, 165, 229, 0.49)', 'rgba(61, 229, 133, 0.49)', 'rgba(229, 61, 61, 0.49)',
'rgba(116, 61, 229, 0.49', 'rgba(218, 229, 61, 0.49)', 'rgba(21, 43, 157, 0.49)', 'rgba(153, 157, 21, 0.49)', 'rgba(199, 143, 186, 0.49)', 'rgba(149, 199, 143, 0.49)',
'rgba(229, 86, 61, 0.49)', 'rgba(212, 229, 61, 0.49)', 'rgba(206, 61, 229, 0.49)', 'rgba(229, 157, 61, 0.49)', 'rgba(61, 165, 229, 0.49)', 'rgba(61, 229, 133, 0.49)',
'rgba(229, 61, 61, 0.49)', 'rgba(116, 61, 229, 0.49', 'rgba(218, 229, 61, 0.49)', 'rgba(21, 43, 157, 0.49)', 'rgba(153, 157, 21, 0.49)', 'rgba(199, 143, 186, 0.49)',
'rgba(149, 199, 143, 0.49)'
];
function addBlock(blockNum) {
scrollContents.append('<div class="block block' + blockNum + '" style="background:' + colors[blockNum] + '"><h4>' + (blockNum + 1) + '</h4></div>');
document.getElementById('cont').innerHTML = blockNum + 1;
}
var totalBlocks = colors.length;
var numBlocks = 6;
scrollContents.width(totalBlocks * 400);
for (var iBlock = 0; iBlock < numBlocks; iBlock++) {
addBlock(iBlock);
}
scrollContainer.scroll(function() {
if (numBlocks != totalBlocks && (scrollContainer[0].scrollLeft > (numBlocks - 5) * 400)) {
addBlock(++numBlocks);
}
});
});#container {
width: 100%;
height: 350px;
position: relative;
overflow: scroll;
background: white;
top: 50px;
overflow: hidden;
}
.block {
display: inline-block;
width: 400px;
height: 350px;
}
#scroll-contents {
height: 100%;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/asvd/dragscroll/master/dragscroll.js"></script>
<body>
<div id="container" class="dragscroll">
<div id="scroll-contents">
</div>
</div>
<div id="cont" style="margin-top:150px; background:blue; height:20px; width:50px; color:white;">
</div>
</body>关于javascript - 强制向左滚动时如何防止闪烁？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30502245/
25
4
0
在 Vim 中，是否可以将窗口“移动”到左侧或右侧？例如，类似于 r或 x ，但是左/右而不是上/下？ 例如，如果我有这个布局: +---+---+---+ | | +---+ | A +--
我有一系列枚举的网页，目前每个页面上都有一个向左和向右箭头图标，用于导航到该系列中的上一页/下一页。 我的问题:实现向左/向右滑动手势以执行相同操作的最简单(!)方法是什么？ (没有其他手势 - 请不
在我的网站上，我有三个 div、一个标题、一个主要内容和右侧的侧边栏。侧边栏是实际问题。我希望侧边栏始终位于浏览器窗口的右侧，如果用户调整窗口大小使宽度低于主栏和侧边栏，则侧边栏会停在主要内容的左边缘
请访问http://lindseymotors.com/v然后单击银色卡车顶部的照片。当展开的 View 弹出时，主照片下方有一排照片。当您点击它们时，它会切换到该照片并在您选择的图像上方显示“正在查
请看一下这个 DEMO 。 使用 this post 中的代码我已成功通过单击左侧或右侧链接使图像水平移动。 我想要实现的是以某种方式使图像跳跃更平滑。 这是我的代码: var scroll
我正在尝试向子菜单添加一个不错的小效果，但我不能使用 marginLeft，因为它会弄乱容器。所以我试图通过使用 left 而不是 marginLeft 来实现它，但我无法让它工作......任何想法
我有一个日历，我想让左右滑动和切换月份成为可能。 是否有任何听众向左/向右滑动？ 谢谢! 最佳答案 您可以像下面的示例一样使用 SimpleOnGestureListener:(显然，将 toast
我正在尝试实现一个ng-repeats 水平用户媒体对象的小部件，我应该能够向左/向右滑动以显示下一张媒体卡。小部件应该看起来像这样 如图所示 下一张卡片头像是半可见的，暗示还有更多卡片可以刷。 这就
我正在创建一个显示多个“页面”内容的应用程序。通常，这代表基于桌面的应用程序上的选项卡。 在 android 上，我希望能够在屏幕上的任意位置使用手指在信息选项卡之间轻拂。这些选项卡的内容将只是 XM
我正在使用: ViewController = [[ViewControllerClass alloc] initWithNibName:@"ViewControllerClass" bundle:[
这个问题已经存在: How to make this into a sliding left/right div 已关闭10 年前。 下面提供的是我的 html 和 css 代码的片段，我不仅需要在
尝试将 h3 向左滑动，p 向右滑动，.info 从下到上滑动 slider .实际上它在没有 jQuery 的 Chrome 和 Opera 中工作得很好，因为我使用了 Animate.css，但它
我发现这个很好的进度条 CSS 动画。 但我想transform: translate而不是left/right。 如何切换到 transform 它？我试过了，但它不起作用: https://cod
我想用 bootstrap 创建一个表，并在列中插入一些左拉和右拉的内容: http://jsfiddle.net/Zoker/sgdfgkvL/ Some content Some
我怎样才能得到 重叠并停在 Logo 的左边缘？当屏幕宽度扩展时，我试图让绿色条向左扩展，但我希望它停在 Logo 的左边缘。 我试过了 position: absolute;在 #green_bar
试图将这个“手势”功能添加到我的第一个程序中，几乎我所做的每一次搜索都来到了这个线程: Fling gesture detection on grid layout 我能够让它工作..但就我而言，我不
我有带 tablayout 的 viewpager，在 ViewPager 内部我有一个正在创建 RecyclerView 的 fragment ， 在 RecyclerVIew roe 项目中，我创
我一直在研究图片库 [html5]，它在桌面版本中运行良好，我想为 Ipad/平板电脑设备添加基于触摸的事件。 您能否建议如何使用 javascript/jquery 添加基于触摸的事件。 谢谢，斯里
所以我想通过将盒子相乘然后去掉下半部分来使盒子向各个方向移动。向上和向右有效，但向下和向左无效。单击 4 个按钮中的 1 个即可调用这些功能。基本的 CSS 和 HTML。我该如何解决这个问题？ va
我已经像这样创建了一个 RecyclerView ItemTouchHelper - public class MyItemTouchHelper extends android.support.v7
我是一名优秀的程序员,十分优秀！