fadein

Is it better to use jQuery fadeIn or CSS3 animations?

一世执手 提交于 2019-12-18 19:17:16
问题 I am creating a simple gallery using some PHP and JavaScript and am trying to do a fade transition between images. Then I wondered if there is a performance difference between using a CSS animation, e.g.: @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } and a jQuery fadeIn. I would like to use the callback from the fadeIn but I also can just use a timer with the CSS I guess. Are either of these likely to work better with large images? I can't see a difference, but

Fade elements in incrementally on window load

戏子无情 提交于 2019-12-18 13:47:08
问题 I'm looking to fade in divs with a certain class in code order, with each fade coming maybe 250ms after the last, giving the impression of a gradual page load. I'm this far for fading in everything at once... $(window).load(function(){ $('div.fade_this_please').fadeIn(4000); }); but I'm not sure where I'm going to cycle through each DIV and fade it in when the other is complete. Can someone point me in the right direction!? Any advice appreciated! 回答1: This fades all divs into view, each with

How to make a label fade in or out in swift

僤鯓⒐⒋嵵緔 提交于 2019-12-18 11:54:02
问题 I am looking to make a label fade in, in viewDidLoad() , and then after a timer is at 3 fade out. I am not familiar with the fadein or fadeout functions. How would I go about doing this? 回答1: Even though the view has loaded, it may not be visible to the user when viewDidLoad is called. This means you might find your animations appears to have already started when you witness it. To overcome this issue, you'll want to start your animation in viewDidAppear instead. As for the fadeIn and fadeOut

Fade in background image with jQuery

女生的网名这么多〃 提交于 2019-12-18 09:54:27
问题 This is the first time I am using jQuery. I am loading a large background image and when it is loaded I am fading it in over three seconds. This script works on Firefox and Chrome but not in IE (of course!). Is there any fail safe way of making it magically work in IE and is there some prettier way of writing it? <div class="bgImage" /> $(document).ready(function () { // add bg image and fade var _image = new Image(); _image.id = 'newImageId'; _image.src = "./css/background.jpg"; $(_image)

Hide images until they're loaded

两盒软妹~` 提交于 2019-12-18 05:24:12
问题 I got a jQuery script which is dinamically appending data to the "holder" at some timeinterval. The data looks like this: <div class="item-box etc etc"> <img src="data.png"> </div> and I'm loading like 50 images at once, my goal is to make them fadeIn , when each image is loaded. I've tried the following: parentDiv.on("load", "img", function() { $(this).parent().fadeIn(500); }); Fiddle: http://jsfiddle.net/3ESUm/2/ but seems that on method doesn't have load or ready methods. I ran out of

jQuery fade in background colour

时间秒杀一切 提交于 2019-12-18 04:38:08
问题 I'm trying to fade in the background colour of a table row, and can't get it right. The fade-in will happen when a button is clicked. I tried something like: $("#row_2").fadeIn('slow').css('background', 'gold') And although this will apply the colour to the table row, it won't fade in, but apply it at once. I'm sure this is a simple thing, but I can't find an answer to that. I've looked all over in this website, but still no luck for this specific thing. Thanks in advance 回答1: The pure jQuery

How to show div when user reach bottom of the page?

荒凉一梦 提交于 2019-12-17 16:46:08
问题 When user scrolls to the bottom of the page I want to show some div, with jQuery of course. And if user scrolls back to he top, div fade out. So how to calculate viewport (or whatever is the right name) :) Thanks 回答1: This must get you started: <!doctype html> <html lang="en"> <head> <title>SO question 2768264</title> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(document).ready(function() { $(window).scroll(function() { if ($('body').height() <= ($(window)

How to show div when user reach bottom of the page?

一世执手 提交于 2019-12-17 16:46:05
问题 When user scrolls to the bottom of the page I want to show some div, with jQuery of course. And if user scrolls back to he top, div fade out. So how to calculate viewport (or whatever is the right name) :) Thanks 回答1: This must get you started: <!doctype html> <html lang="en"> <head> <title>SO question 2768264</title> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(document).ready(function() { $(window).scroll(function() { if ($('body').height() <= ($(window)

How do you fadeIn and animate at the same time?

[亡魂溺海] 提交于 2019-12-17 08:46:32
问题 Using jQuery I'm creating a basic 'tooltip' animation so that the tooltip will appear in a little animation in which it fades into view as well as move vertically. So far I have this: $('.tooltip').fadeIn('slow'); $('.tooltip').animate({ top: "-10px" }, 'slow'); Doing it that way or this way: $('.tooltip').fadeIn('slow').animate({ top: "-10px" }, 'slow'); The animations will run one at a time, the fade in first and then the vertical animation. Is there a way to have it do both at the same

How do you fadeIn and animate at the same time?

情到浓时终转凉″ 提交于 2019-12-17 08:46:07
问题 Using jQuery I'm creating a basic 'tooltip' animation so that the tooltip will appear in a little animation in which it fades into view as well as move vertically. So far I have this: $('.tooltip').fadeIn('slow'); $('.tooltip').animate({ top: "-10px" }, 'slow'); Doing it that way or this way: $('.tooltip').fadeIn('slow').animate({ top: "-10px" }, 'slow'); The animations will run one at a time, the fade in first and then the vertical animation. Is there a way to have it do both at the same