Ich benutze ein <marquee> Tag für die kontinuierliche horizontale Verschiebung des Bildes. Angenommen, ich habe 5 Bilder, die sich gut bewegen, aber nach Abschluss der letzten Bildbewegung gibt es eine große Lücke, um mit dem Scrollen vom ersten Bild zu beginnen. Wie kann ich das tun?
Mein Code ist etwas wie das:
<marquee direction="right">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
</marquee>
Antworten:
2 für die Antwort № 1Festzelt (<marquee>) ist ein veraltetes und kein gültiges HTML-Tag. Sie können viele jQuery-Plugins verwenden. Einer davon ist es jQuery Newsticker. Es gibt viele mehr!
2 für die Antwort № 2
Sie können Bilder nicht kontinuierlich mit dem HTML-Marquee-Tag scrollen - es muss JavaScript für die kontinuierliche Scrolling-Funktion hinzugefügt werden.
Es gibt ein JavaScript-Plugin namens crawler.js Verfügbar auf dem dynamischen Laufwerk Forum für das Erreichen dieser Funktionalität. Dieses Plugin wurde von John Davenport Scheuer erstellt und im Laufe der Zeit an neue Browser angepasst.
Ich habe dieses Plugin auch in meinem Blog implementiert, um alle Schritte zur Verwendung dieses Plugins zu dokumentieren. Hier ist der Beispielcode:
<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="/images/assets/images/products/ie.png" />
<img src="/images/assets/images/products/browser.png" />
<img src="/images/assets/images/products/chrome.png" />
<img src="/images/assets/images/products/safari.png" />
</div>
Hier ist die Plugin-Konfiguration:
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 für die Antwort № 3
Ich denke, dass Sie die Breite des Rahmens auf 5 Bilder Gesamtbreite festlegen. Es funktioniert gut
Ex: <marquee style="width:700px"></marquee>
0 für die Antwort № 4
Versuche dies:
<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/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
<img src="/images/images/a.jpg">
</marquee>