Dieser Artikel beschreibt die Methode von JS, um den Text mit der Maus zu verschieben. Teilen Sie es für Ihre Referenz. Die spezifische Analyse ist wie folgt:
Dies ist ein sehr einfacher Mausfunktionscode. Beim Verschieben der Maus auf einer Webseite wird die Maus von einer Textfolge nach der Maus verschoben.
Kopieren Sie den Code wie folgt: <html>
<kopf>
<style type = "text/css">
.spannestyle {
Farbe: 000000; Schriftgröße: 10pt; Position: absolut; Top: -50px; Sichtbarkeit: sichtbar
}
</style>
<Script>
var x, y
var Step = 18 // Dies ist das Intervall zwischen zwei benachbarten Zeichen
var flag = 0
var message = "wulin.com www.vevb.com Willkommen zu Ihrem Besuch!" // Geben Sie den Text ein, den Sie hier anzeigen müssen
message = message.split ("") // die Zeichenfolge in ein Array zerlegen
var xpos = new Array () // Erstellen Sie ein Array, um die X-Koordinaten jeder Position aufzunehmen
für (i = 0; i <= message.length-1; i ++) {// Zuerst jedem Element einen Anfangswert zuweisen
xpos [i] =-50
}
var ypos = new Array () // Erstellen Sie ein Array, um die Y -Koordinaten jeder Position aufzuzeichnen
für (i = 0; i <= message.length-1; i ++) {
ypos [i] =-200
}
Funktion MoveHandler (e) {// Mausbewegungsereignisse verarbeiten
x = (document.layers)? E.Pagex: document.body.scrollleft+event.clientX // Legen Sie die horizontale Position der Maus nach dem Browser an
y = (document.layers)? E. Pagey: document.body.Scrolltop+Event.Clienty // Aufzeichnung der vertikalen Position der Maus aufzeichnen
Flag = 1 // Die Mausposition hat sich geändert und muss neu berechnet werden
}
Funktion makeNake () {
if (flag == 1 && document.all) {// wenn es dh ist
für (i = message.length-1; i> = 1; i--) {// Koordinaten-Warteschlangen verarbeiten
XPOS [i] = XPOS [I-1]+Schritt // Jedes Koordinatendaten ein Gitter verschieben und Zeichenabstand hinzufügen
ypos [i] = ypos [i-1]
}
XPOS [0] = X+Schritt // Schreiben Sie neue Daten in den Schwanz der Koordinaten -Datenwarteschlange
ypos [0] = y
für (i = 0; i <message.length-1; i ++) {
var thisspan = eval ("span"+(i)+". style") // generieren Sie das aktuelle Betriebsobjekt spanx.style
thisspan.posleft = xpos [i]
thisspan.postop = ypos [i]
}
}
else if (flag == 1 && document.layers) {// wenn es ns ist
für (i = message.length-1; i> = 1; i--) {// Koordinaten-Warteschlangen verarbeiten
XPOS [i] = XPOS [I-1]+Schritt // Jedes Koordinatendaten ein Gitter verschieben und Zeichenabstand hinzufügen
ypos [i] = ypos [i-1]
}
XPOS [0] = X+Schritt // Schreiben Sie neue Daten in den Schwanz der Koordinaten -Datenwarteschlange
ypos [0] = y
für (i = 0; i <message
var thispan = eval ("document.span"+i) // Generieren Sie das aktuelle Operation Object document.spanx
thisspan.left = xpos [i]
thisspan.top = ypos [i]
}
}
var timer = setTimeout ("makeNake ()", 30) // nach 30 Millisekunden, passen Sie die Position jedes Zeichens erneut gemäß der Situation an.
}
</script>
</head>
<body bgcolor = "ffffff" onload = "makeNake ()">
<Script>
<!- Beginn von JavaScript-
// Hier erstellen wir eine Spannweite als Container für jedes Wort
für (i = 0; i <= message.length-1; i ++) {
document.write ("<span id = 'span"+i+"' class = 'spanStyle'>")
document.write (meldung [i])
document.write ("</span>")
}
// Geben Sie den Prozess des Umgangs mit Mausbewegungsereignissen an
if (document.layers) {
document.captureEvents (Event.MousEmove);
}
document.onmousemove = MoveHandler;
// - Ende von JavaScript - ->
</script>
</body>
<br> <b> Ist dieser Effekt sehr cool? </b> </br>
</html>
Ich hoffe, dieser Artikel wird für JavaScript -Programme aller hilfreich sein.