jQuery .hide function not working

Question

Hy guys and hope you can help.

I have a very simple jQuery hide function that was working but some bugInTheRom has occured overnight and it no longer does. Effectively I'm trying to add a 'Patience' warning visible whilst some SWF loads.

Here's my call in the <head> section...

<script type="text/javascript" src="js/jquery-1.6.1.js"></script>
<script type="text/javascript">
function hidden() {
    $('.patience').hide();
};
window.onload=hidden;
</script>

and here's the class it affects...

<p class="patience">Please be patient, the interactive book below and the PDF links may take a while to fully load.</p>

and the associated CSS...

.patience {
    visibility: visible;
    background-color: #CCC;
    border: 1px solid #000;
    margin-right: 10px;
    margin-left: 10px;
}

Any ideas why it doesn't hide once the whole of the SWF has been loaded?

My thanks. R

does it not hide at all, or does it hide too early?

Alnitak
– Alnitak

2011-06-28 17:09:35 +00:00
Commented Jun 28, 2011 at 17:09 — Alnitak
– Alnitak, Commented Jun 28, 2011 at 17:09

Mu Mind · Accepted Answer · 2011-06-28 17:09:40Z

3

If you're having problems, I would switch to:

$(document).ready(function () {
    $(window).load(function () {
        $('.patience').hide();
    });
});

which might help everything initialize properly.

I'm not sure I understand how the SWF is related... perhaps you meant to say swf_elem.onload or something instead of window.onload?

answered Jun 28, 2011 at 17:09

Mu Mind

11.3k4 gold badges43 silver badges70 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Alnitak Over a year ago

@Rog did you test this one? It's the cleanest answer, and also considers that there may be some other event being fired by the SWF loader.

Rog Over a year ago

Thanks both to @Mu Mind and @Alnitak, I tried this and, sadly, it didn't work. It's live here, rogw.net/lulworth . @Alnitak, thanks for your perserverence, I'll hunt out a JS debugger.

Naftali · Accepted Answer · 2011-06-28 17:11:33Z

1

For one thing change window.onload=hidden; to $(function(){hidden();});

The new way i suggested is using jQuery's version of document ready which makes sure that the elements that you might want to affect are loaded and can be used.

Also i see nothing in your code which connects this hidden() function to any SWF load

See Fiddle: http://jsfiddle.net/maniator/XX8ym/

edited Jun 28, 2011 at 17:11

answered Jun 28, 2011 at 17:04

Naftali

147k41 gold badges247 silver badges304 bronze badges

19 Comments

Ender Over a year ago

Wouldn't $(hidden); be more efficient?

Naftali Over a year ago

@Ender, that is under the assumption that the OP does not want to do anything else on startup, yes.

Rog Over a year ago

Thanks Neal, I deliberately skipped including all the |SWF load stuff, I'll experiment with your new function call and come back.

Bobby D Over a year ago

From the Mozilla docs:

The load event fires at the end of the document loading process. At this point, all of the objects in the document are in the DOM, and all the images and sub-frames have finished loading.

Basically, this means that onload is called when the DOM is loaded, but not necessarily when a plugin is loaded. As @Neal mentioned, you need to see if flash will raise an event once loaded and bind to that.

Ender Over a year ago

Also, something I just noticed - OP is trying to run his function on page load, whereas our suggestions would execute the function on DOM ready. Minor difference, but could be important.

|

Alnitak · Accepted Answer · 2011-06-28 17:31:56Z

Firstly - window.onload is the right place to put this handler - unlike $(document).ready() it will wait until all sub-frames, images, etc, have loaded.

What I don't know is whether window.onload will also wait for an SWF object to be loaded.

If it doesn't wait for the SWF, then the effect would be that your .patience div will disappear too early, since the rest of the page will have finished loaded.

It it does wait, but your div isn't disappearing at all, this suggests that you've simply got a trivial error somewhere in your real JS code that is preventing the .hide() from ever being called.

Since you've said that the div isn't disappearing, I would suggest that you've got the latter problem, in which case a few minutes with a JS debugger should reveal (no pun intended) the problem.

dev_musings · Accepted Answer · 2011-06-28 17:06:53Z

0

May be your jQuery failed to load. Also, when using jQuery, use jQuery's $.ready instead of window.onload to ensure all things are in peace before trying to do anything!

answered Jun 28, 2011 at 17:06

dev_musings

1,2011 gold badge11 silver badges17 bronze badges

Comments

Rog · Accepted Answer · 2011-06-29 06:48:01Z

0

My stupid mistake!

Nothing wrong with the code I showed you but I discovered that I was calling <script type="text/javascript" src="js/jquery-1.6.1.js"></script>in the head and only the "js/jquery-1.6.1.min.js" script existed on my server.

Feel stupid now but thanks all who contributed.

Cheers Rog

answered Jun 29, 2011 at 6:48

Rog

1

Collectives™ on Stack Overflow

jQuery .hide function not working

5 Answers 5

2 Comments

19 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

19 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related