Web Design Forum: JQuery img swap and delayed refresh - Web Design Forum

Jump to content

WDF
WDF Premium Memberships Reseller Hosting
Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

JQuery img swap and delayed refresh onclick event

#1 User is offline   person4659 

  • Forum Newcomer
  • Pip
  • Group: Members
  • Posts: 79
  • Joined: 07-July 11
  • Reputation: 2
  • Gender:Male
  • Experience:Beginner
  • Area of Expertise:Designer

Posted 19 January 2012 - 11:19 AM

something quite simple, but im not entirely sure how to do it. Basically when i click a button, i want it to swap the image for a pleasewait .gif and the after 3 seconds or so direct to a page, or refresh the page. This is just really to make the script i have look like it is actually doing something as its pretty instant.
Could someone please give me an idea of how to achieve it?

thanks :D
0

#2 User is offline   hodephdesign 

  • Dedicated Member
  • PipPip
  • Group: Members
  • Posts: 129
  • Joined: 18-January 12
  • Reputation: 10
  • Gender:Male
  • Location:Cardiff, Wales
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 19 January 2012 - 11:34 AM

View Postperson4659, on 19 January 2012 - 11:19 AM, said:

something quite simple, but im not entirely sure how to do it. Basically when i click a button, i want it to swap the image for a pleasewait .gif and the after 3 seconds or so direct to a page, or refresh the page. This is just really to make the script i have look like it is actually doing something as its pretty instant.
Could someone please give me an idea of how to achieve it?

thanks :D


Have a click function set up on the button (onclick in JS, .click() in jQuery) that changes the src of the button (assumedly an input type="image" or img). Then add a setTimeout call including the redirect code.

Example (jQuery):

$("#button").click(function () {
   $("#button").attr("src","images/waiting.gif");
   setTimeout('window.location = "http://www.yoursite.com"',3000);
});


That's just off the top of my head, may not be 100% copy and pastable...

EDIT: to reload use window.location.reload()

This post has been edited by hodephdesign: 19 January 2012 - 11:35 AM

0

#3 User is offline   person4659 

  • Forum Newcomer
  • Pip
  • Group: Members
  • Posts: 79
  • Joined: 07-July 11
  • Reputation: 2
  • Gender:Male
  • Experience:Beginner
  • Area of Expertise:Designer

Posted 19 January 2012 - 01:52 PM

View Posthodephdesign, on 19 January 2012 - 11:34 AM, said:

Have a click function set up on the button (onclick in JS, .click() in jQuery) that changes the src of the button (assumedly an input type="image" or img). Then add a setTimeout call including the redirect code.

Example (jQuery):

$("#button").click(function () {
   $("#button").attr("src","images/waiting.gif");
   setTimeout('window.location = "http://www.yoursite.com"',3000);
});


That's just off the top of my head, may not be 100% copy and pastable...

EDIT: to reload use window.location.reload()


thanks for that ill take a look in a little while :)
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users