Jump to content

Resetting Jquery function


kpiatak

Recommended Posts

I would like to have the function reset when you click the button a second time, how would you go about doing this?

<!DOCTYPE html><html><head>  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >  <title>Slide 8 Messages</title>  <link rel="stylesheet" href="css/style.css" />  <script src="http://code.jquery.com/jquery-latest.js"></script><style>.bus {position: relative;content: url('assets/school-bus.png');left: -700px;top: 450px;}.phonefade {content: url('assets/school-bus-phone.png');position: absolute;top: 270px;left: 1250px;width: 427px;height: 641px;z-index: 1;display: none;}#messages {width: 1920px;height: 930px;background: url('assets/split-bg.png');}#phone {position: absolute;top: 270px;left: 1250px;width: 427px;height: 641px;background: url('assets/phone_noMessage.png');z-index: 0;}.textMe {position: absolute;top: 350px;left: 320px;width: 300px;height: 80px;background: url('assets/textme.png');}.text h1 {color: white;font-size: 30pt;font-family: helvetica, arial;display: block;position: absolute;top: 230px;left: 220px;}</style></head><body><div id = "navBar">  <div id = "navBarTabs"><a href="iris_thermostat.html">Thermostat</a></div>  <div id = "navBarTabs"><a href="iris_lock.html">Lock</a></div>  <div id = "navBarTabs"><a href="iris_camera.html">Camera</a></div>  <div id = "navBarTabs"><a href="iris_smartplug.html">Smart Plug</a></div>  <div id = "navBarTabs"><a href="iris_alarm.html">Alarm</a></div>  <div id = "navBarTabs"><a href="iris_modes.html">Modes</a></div>  <div id = "navBarTabs"><a href="iris_magicrules.html">Magic Rules</a></div>  <div id = "navBarTabs"><a href="iris_messages.html">Messages</a></div>  <div id = "navBarTabs"><a href="iris_petdoor.html">Pet Door</a></div>  <div id = "navBarTabs"><a href="iris_elderlycare.html">Elderly Care</a></div></div><div id ="demoArea">  <div id="messages">    <div class="text"><h1>When my child's key fob enters house</h1></div>   <button class="textMe"></button>      <div class="bus"></div>    <div class="phonefade"></div>      <div id="phone"></div>  </div></div><script>    $("button.textMe").click(function() {	  $("div.bus").animate	  ({"left": "+100px"}, (1500));	  $("div.phonefade").delay(1500).fadeIn(500);    });</script></body></html>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...