使用滚动标签连续滚动滚动图像 [英] scroll image with continuous scrolling using marquee tag
问题描述
我正在使用< marquee> 标记来继续水平移动图片。假设我有5张图片比它移动得好，但在完成最后一张图片移动后，从第1张图片开始滚动有很大差距。我该如何管理它？
I am using a <marquee> tag for continues moving of image horizontally. Suppose I have a 5 images than it moving fine but after completion of last image move there is a big gap to start scrolling from 1 st image.How can i mange this?
我的代码是这样的：
<marquee direction="right">
<img src="images/a.jpg">
<img src="images/a.jpg">
<img src="images/a.jpg">
<img src="images/a.jpg">
<img src="images/a.jpg">
<img src="images/a.jpg">
</marquee>
推荐答案
它必须为持续滚动功能添加JavaScript。
You cannot scroll images continuously using the HTML marquee tag - it must have JavaScript added for the continuous scrolling functionality.
有一个JavaScript插件叫做 crawler.js 可在动态驱动器论坛上获得此功能。这个插件是由John Davenport Scheuer创建的，并且随着时间的推移被修改以适应新的浏览器。
There is a JavaScript plugin called crawler.js available on the dynamic drive forum for achieving this functionality. This plugin was created by John Davenport Scheuer and has been modified over time to suit new browsers.
我也在我的博客中实现了这个插件来记录所有使用步骤这个插件。以下是示例代码：
I have also implemented this plugin into my blog to document all the steps to use this plugin. Here is the sample code:
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="assets/js/crawler.js" type="text/javascript" ></script>
</head>
<div id="mycrawler2" style="margin-top: -3px; " class="productswesupport">
<img src="assets/images/products/ie.png" />
<img src="assets/images/products/browser.png" />
<img src="assets/images/products/chrome.png" />
<img src="assets/images/products/safari.png" />
</div>
以下是插件配置：
marqueeInit({
uniqueid: 'mycrawler2',
style: {
},
inc: 5, //speed - pixel increment for each iteration of this marquee's movement
mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
moveatleast: 2,
neutral: 150,
savedirection: true,
random: true
});
这篇关于使用滚动标签连续滚动滚动图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
