jQuery, image loading events_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-02-10 11:22 出处：网络

i\'m building a jQuery Plugin to turn a div full of <img /> into a gallery. I ran into a problem, i can\'t seem to solve:

i'm building a jQuery Plugin to turn a div full of <img /> into a gallery. I ran into a problem, i can't seem to solve:

right now, i call the plugin on document ready so, for a few 10ths of a second, i can see all the images at the same time, before i hide() all but the first one.

the plugin works this way:

$(function(){$('div').gallery();});

and 开发者_C百科in the plugin:

$(this).find('img').wrap('<div />').hide();
$(this).find('img:first').show();

does anyone have any suggestions?

Thanks

If I want to hide stuff for browsers that support js I find that the best way is to

<body>
  <script>document.body.className = "js";</script>

Then you could just hide stuff in your css

body.js .mygalleryimagesdiv {
  display: none;
}

And show them when you're ready in the script... This is the only non unobtrusive script i allow myself to write :)

You have no control over when the user of your plugin calls it.

He/she may delay calling it for seconds or minutes after the page has loaded along with all the images. So it is up to him/her to hide the images e.g. via CSS: {display: none}.

You should initially hide the images preferably via CSS or by using inline styles. You can then show them via jQuery.show() or jQuery.css() methods.