I am trying to figure out how to make an image move from the left to the right of a page when a button is clicked. I thought the code below would work, but unfortunately, it's not functioning as expected. I'm new to JQuery and could use some guidance.
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/
jquery.min.js"> </script>
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$( "#but2" ).click(function() {
$( "#vehi1" ).animate({ right:300px }, 500 );
})
</script>
</head>
<body>
<div id="homel11">
<button id="but2"style="top:200px;left:30px;position:fixed">click me</button>
</div>
<div id="vehi" ><img id="vehi1" style="left:0px;position:relative;
top:540px;"src="vehi.png" />
</div>
</body>
</html>