Hack Forums
[Help] [HTML] Make one image fly all over the place - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Coding (https://hackforums.net/forumdisplay.php?fid=151)
+---- Forum: Coders Lounge (https://hackforums.net/forumdisplay.php?fid=5)
+---- Thread: [Help] [HTML] Make one image fly all over the place (/showthread.php?tid=4409436)



[HTML] Make one image fly all over the place - joneh heil - Aug 22, 2014

I am trying to make a sort of troll website and I need one image to fly all over the place. Could anyone help me out?

Thank you.


* - badvibes - Aug 23, 2014

Don't know anything about HTML, but, can't you just render and image at an x and y, and after every few milliseconds add 1 to the x or y?

Don't know anything about HTML, but..
Code
<!DOCTYPE html>
<html>
<head>
  <style>
div {
  position:absolute;
  background-color:#abc;
  left:50px;
  width:90px;
  height:90px;
  margin:5px;
}
</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <button id="left">&laquo;</button> <button id="right">&raquo;</button>
<div class="block"></div>

<script>
$("#right").click(function(){
  $(".block").animate({"left": "+=50px"}, "slow");
});

$("#left").click(function(){
  $(".block").animate({"left": "-=50px"}, "slow");
});

</script>

</body>
</html>
Once again, don't know anything about HTML


* - RuffledUp - Aug 23, 2014

You'd use a bit of javascript to do that. HTML on its own isnt designed for jazz. Dont use the piece of jquery above. Go do a some basic reading on javascript and you'll be throwing dicks around your web page in no time.