Heim > Web-Frontend > js-Tutorial > So verschieben Sie Bilder mit Javascript nach links und rechts

So verschieben Sie Bilder mit Javascript nach links und rechts

一个新手
Freigeben: 2017-10-11 10:11:12
Original
4191 Leute haben es durchsucht

Die Bewegung des Bildes nach links und rechts hat einen Animationseffekt wie eine Schaukel. Das Bild selbst kann neu definiert werden, und die Bewegungsgeschwindigkeit und -entfernung kann auch im Code eingestellt werden einfacher Js-generierter Animations-Spezialeffektcode, nur als Referenz.

<!DOCTYPE html>
<html>
<head> 
<meta charset="UTF-8"> 
<title>自定义动画</title> 
<script type="text/javascript" src="jquery.1.12.4.js"></script> 
<style> * {
    margin: 0;
}
</style> <script type="text/javascript"> var moveToLeft = function () {
    $("#topImg").animate( {
    "left": "0"
}
, "slow", moveToRight);
}
;
    var moveToRight = function () {
    $("#topImg").animate( {
    "left": "100px"
}
, "slow", moveToLeft);
}
;
    $(function () {
    $("button").click(moveToRight);
}
);
    </script></head><body><button>点击我右移100px</button><br/><br/><br/><br/><img id="topImg" style="position: absolute;
    left: 0" src="图片1_30.jpg"/></body></html>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonSo verschieben Sie Bilder mit Javascript nach links und rechts. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage