2

Let's say I have a full image div that fadeouts when the user enters to the site on homepage.

I want to hide that full image animation if the user enters to any section (bio, gallery) and comes back to home.

I tried using a cookie like this:

if (jQuery.cookie('hasVisited')) {

} else {
jQuery.cookie('hasVisitied', 'true');
    jQuery('#home-image').hide();
}

But the problem is that this hides the image for always if the user enters to the page again, Not just to any section.

How can I point to hide the #home-image if the user come from subpages of the website.

Let me know if i'm not clear with the question!

This would be the events:

  1. User visits website and there is a full screen image fadeout animation on home
  2. He enters to biography section and then comes back to homepage without having to see the full screen image animation.
  3. Hours later he decides to visit the website again and on homepage he sees the full screen image fadeout animation.
6
  • Your not exactly clear...give us a run through of events if you were a user.
    – VIDesignz
    Feb 6, 2014 at 22:40
  • Quick tip: you can write $( instead of jQuery(. Much simpler and shorter ;) Feb 6, 2014 at 22:42
  • Relevance to php tag? Feb 6, 2014 at 22:42
  • @VIDesignz I updated my question with an hypothetical scenario.
    – codek
    Feb 6, 2014 at 23:01
  • Did you set an expiration for the cookie?
    – VIDesignz
    Feb 6, 2014 at 23:04

2 Answers 2

2

Instead of using cookies, you could end links back to your home page with something like #returning. So, links to your home page may looks like ./#returning or www.yoursite.com#returning.

From there, you can use JavaScript's window.location.hash to determine whether or not the user is returning to your home page or not. It should return something like #returning.

So, linking to your home page:

<a href="./#returning>Home</a>

And your JavaScript on the home page:

if(window.location.hash === "#returning")
    $('#home-image').hide();

Otherwise, if you want to stick with the cookie method, try to find a way to delete the cookies upon the user leaving your site, although that would be a bit more difficult.

Good luck!

1
  • Thanks for the tip! Just joined, so I didn't know I could do that. Good to know for the future.
    – Rhitakorrr
    Feb 7, 2014 at 4:43
1

You need to only add the cookie when they're on of the alternate pages. You can either check the location.pathname via javascript, or only include/execute this script on those pages.

As long as the home page doesn't trigger the cookie, it should work

4
  • I don't get it. If I put the cookie on the other pages, he will not see the image on Home. But also if he visits the Home after some hours he will not see the image because he has already opened the other sections.
    – codek
    Feb 6, 2014 at 22:56
  • Then can you clarify in which scenarios the user should not see it? If you specifically need to hide it when they come from a different subpage, you can check the referrer header. Cookies typically last a while unless you customize the expires value
    – helion3
    Feb 6, 2014 at 22:58
  • Yeah, that's exactly what I'm looking for... hide the image then they come from subpages of the site! What would be the way to do this?
    – codek
    Feb 6, 2014 at 23:02
  • You can try comparing the document.referrer which is the url of the page that sent them. If it matches your domain or certain pages/folders then you can hide the image. See here for more info: stackoverflow.com/questions/2031362/checking-the-referrer
    – helion3
    Feb 6, 2014 at 23:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.