发表新帖
发表新帖

scroll image with continuous scrolling using marquee tag

前端 未结
关注
4 1025
轻奢々
轻奢々 2020-12-17 04:53

I am using a tag for continues moving of image horizontally. Suppose I have a 5 images than it moving fine but after completion of last image m
相关标签:
4条回答
  • 鱼传尺愫
    2020-12-17 05:28

    You cannot scroll images continuously using the HTML marquee tag - it must have JavaScript added for the continuous scrolling functionality.

    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>

    Here is the plugin configration:

    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
});
    0 讨论(0)
  • 被撕碎了的回忆
    2020-12-17 05:32

    Marquee (<marquee>) is a deprecated and not a valid HTML tag. You can use many jQuery plugins to do. One of it, is jQuery News Ticker. There are many more!

    0 讨论(0)
  • 鱼传尺愫
    2020-12-17 05:37

    I think you set the marquee width related to 5 images total width. It works fine

    ex: <marquee style="width:700px"></marquee>

    0 讨论(0)
  • 抹茶落季
    2020-12-17 05:38

    Try this:

    <marquee behavior="" Height="200px"  direction="up" scroll onmouseover="this.setAttribute('scrollamount', 0, 0);this.stop();" onmouseout="this.setAttribute('scrollamount', 3, 0);this.start();" scrollamount="3" valign="center">

    <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>
    0 讨论(0)
 看不清?
提交回复
热议问题