Hier wird ein kleiner JavaScript-Balz-Spezialeffekt erstellt:
Es kann nicht nur der Effekt des Bildes unten angezeigt werden, sondern auch die Figur dazu gebracht werden, der Mausdrehung zu folgen Ein kleines, unverändertes Beispiel, das auf diesem Beispiel basiert, kann das Werben unterhaltsamer machen. Männer und Männer, können Sie Ihrer kleinen Loli eine solche Webseite schicken? Eindrucksvoll.
Fügen Sie den Code ein:
;/title> ;
definiert /javascript ">
//Warum Onload verwendet wird, denn als ich das Clock-Div im Javascript-Code initialisierte, stellte die Debugging-Seite fest, dass es nicht implementiert war
//Später fand ich den Grund heraus, das HTML Der Code wird von vorne nach hinten analysiert. Wenn der JavaScript-Code zuerst analysiert wird und dem Körper
// untergeordnete Knoten hinzugefügt werden, kann der nicht analysierte Körper nicht gefunden werden. Sie sollten also zuerst den Körper analysieren. Es gibt zwei Methoden: Eine besteht darin,
// zu schreiben, und die andere besteht darin, die Onload-Methode in das Body-Tag einzufügen.
window.onload=function(){
init();
//Definieren Sie ein Div-Array zum Speichern von 12 Divs
//Weil die 12-Div-Positionsbeziehung, also zuerst Bestimmen Sie den Punkt und den Radius, um die Position des Div zu berechnen.
var divs=[]; ","你","爱","我","我","Mian","Mian"]
var CX=300;
var CY=300;//-- ---- ----------------Gibt es auf der Webseite keine Einheiten für die Standortkoordinaten?
var R=150;
var divCenterNode;//Um die Position des Mittelpunkts zu steuern, legen Sie die globale Variable fest
//Definieren Sie eine Initialisierungsfunktion
function init(){
/ / Erstellen Sie ein Div im Mittelpunkt (Sie können Ihr Werbeobjekt schreiben)
divCenterNode=document.createElement("div");
divCenterNode.innerHTML="Tingting, marry me!"; body.appendChild(divCenterNode);
divCenterNode.style.left=(CX-50) "px"
divCenterNode.style.top=(CY-30) "px"; divs, um eine verbotene Uhr zu bilden und sie im Körper zu platzieren
for(var x=1;x<=12;x ){
//Create div
var divNode=document.createElement(" div" );
divNode.innerHTML=loveBaby[x-1];
//Das Körperobjekt muss nicht wie andere Objekte abgerufen werden, es wurde in der js-Bibliothek gekapselt.
document.body.appendChild(divNode);
divs.push(divNode);
} // Das div-Element jedes Mal neu positionieren, wenn startClock() gestartet wird
/*
Um den Rotationseffekt zu erzielen, müssen Sie tatsächlich einen kontinuierlichen Versatz oder eine
Neupositionierung durchführen. Wenn Sie jedoch eine Schleife ausführen, können Sie nicht steuern, wie lange die Funktion in Intervallen gestartet wird, weshalb
das Fensterobjekt bereitstellt eine Methode zu diesem Zeitpunkt.
*/
startClock();
}
//Offset von div
var offset=0;//Offset von Grad
//Ändern Sie die Position. Definieren Sie a separate Funktion für Positionierung und Drehung
function startClock(){
for(var x=1;x<=12;x ){
var div = divs[x-1]; Der Grad jeder Zahl
var dushu=30*x offset;
//Winkelwert* Math.PI /180 = Bogenmaßwert
var divLeft = CX R*Math.sin(dushu*Math .PI /180);
div.style.left=divLeft "px";
var divTop = CY-R*Math.cos(dushu*Math.PI/180);
div.top= divTop "px";
}
offset =50;
//Rufen Sie diese Funktion in einem bestimmten Intervall zurück
//Berechnen Sie einen Ausdruck nach dem angegebenen Millisekundenwert. Der erste Parameter ist ein Ausdruck und der zweite Parameter ist die Zeit
setTimeout(startClock,80);//Methode des Fensterobjekts
}
//Definieren Sie diese Uhr so, dass sie sich mit der Mausbewegung an verschiedene Positionen bewegt
function clockMove(event){
CX=event.clientX;//x-Koordinate der Mausposition
CY=event.clientY;//y-Koordinate der Mausposition
divCenterNode.style. left=(CX-50) "px";
divCenterNode.style.top=(CY-30) "px";
head>
1--12
2, um 12 DIVs in einem Kreis zu positionieren.
-->
Ursprünglich wollte ich eine Uhranzeige erstellen, die sich drehen und laufen lässt. Die Benennung im Code bezieht sich also auf die Uhr, also machen Sie sich darüber keine Sorgen, mein Lieber. Ich bin Javascript-Neuling und finde, dass Javascript sehr leistungsfähig ist.Stellungnahme:Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn