View Full Version : J Scheuer Fade-in Fade-out Same Div on Different Pages

12-31-2014, 11:32 AM
Hi guys, please one more request...

The following script that was written by J Scheuer use to work just great in all browsers to fade-out the content of a div on page unload and then fade-in the content of the equivalent div on another page load.

I recently noticed however that now it has an issue with the new Firefox... if you use the back button to return to the first page whose div content was faded out, the div/content remains hidden (as it was left on page un-load).

Can it be altered to deal with whatever changes were made in the browser? ---Thanks

The issue can be seen here (www.billyjoeconor.com/freebies/cell-savers/select.php) when navigating from the first set of 4 images to the second set of 4 images (which are on a different page in the equivalent div), and then returning to the first set by way of the browser's back button --- they no longer display, unless you refresh the page.

$('head').append('<style type="text/css">#d1 {visibility: hidden;}</style>');
$('#d1').css({opacity: 0, visibility: 'visible'}).animate({opacity: 1}, 600, 'linear', function(){
if(typeof fleXenv === 'object' && typeof fleXenv.globalInit === 'function'){
var t = e.target;
while (t.tagName && !re[0].test(t.tagName)){
t = t.parentNode || null;
if(t && t.tagName && !t.target || re[1].test(t.target)){
$('#d1').animate({opacity: 0}, 600, 'linear', function(){
location = t.href;
})([/^(a|area)$/i, /^_(top|self|parent)$/]);

01-01-2015, 10:47 AM
If it helps, it works fine here in Opera and Chrome but fails in Firefox.

01-03-2015, 10:59 AM
Thanks for your feedback. I just edited my post for accuracy.
It's also in Firefox where I discovered the div content is no longer there when returning to its page with the back button.
Previously that never happened with John's code. It worked in FF as well as you see in Opera and Chrome.

Happy New Year