11

Hide div when the page loads and displays the same after a few seconds

 3 years ago
source link: https://www.codesd.com/item/hide-div-when-the-page-loads-and-displays-the-same-after-a-few-seconds.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

Hide div when the page loads and displays the same after a few seconds

advertisements

i have a div which i want to hide when the page loads and want to display the same after few seconds.how do i do this using jquery.

HTML CODE

<div id="bio1">
<div class="carousel_titles">
    <h6>Saul Yarmak</h6>
        <div class="ops">Chairman & CEO</div>
     </div>
     <div class="img_block wrapped_imgs">
        <img src="img/pictures/team1.jpg" alt="Tom" />
     </div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make  </p>
</div>


You should hide it by default using css:

#bio1 {
    display:none;
}

and then you can use delay() to show it after a few seconds:

$('#bio1').delay(3000).fadeIn();

Fiddle Demo

Related Articles

Hide DIV when the page loads based on the value of the selected field

I have the following script that hides/shows 2 div's based on the contents of a select ID's value when it's changed. This works fine. <script type="text/javascript"> $(function () { $("#ue_package").change(function () { if ($(thi

JQuery Hide Div when the option is selected

I want to hide a class of a DIV when a specific OPTION Value is selected <select id="tagtype" name="type"> <option value="type_s">Standard</option> <option value="type_o">Overstock</option

Set cookie to hide div when the button is clicked

I'm trying to display a div (containing terms and conditions) which is shown by default unless a cookie is set to hide it. I have added my code here to a JSFiddle Any ideas why my code isn't working? JavaScript function TermsAndConditions(){ days=30;

hidden arrow on page load and display on click

I am working on hide and show functionality... i have one bug in my code.. when i click the first div...the content is opening from down to top... at that time only the arrow should show up... but on page load itself its showing the arrow.. providing

Hide Div when the chosen option chooses

I have a div that I need to hide when an option is selected in an option, below is my current html: Type:<select name="Type" id="Type"> <option value="choice">Multiple choice</option> <option value="

jQuery Show / Hide Div when the section is in Viewport

My code at the moment is here: http://www.jaygeorge.co.uk/gwennan-sage You'll see two green arrows that are in a fixed position at the bottom of the page. I'm having trouble getting jQuery to hide these divs (#timeline-buttons) when the Timeline sect

How to hide div when the browser resizes to less than 800px

Ok, so I am just starting to learn jquery, and I am in a stump. I have this javascript here that I am trying to get working: $(function(){ $(window).scroll(function() { if ($(this).scrollTop() > 890) { $(".mobile-nav:hidden").css('visibility'

Load the URL into the Web after a few seconds

I'm creating one application in Android. It has one layout named main.xml main.xml: <ImageView android:id="@+id/imageView1" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawab

Android - how to hide the button after a few seconds of inactivity

I have an app that downloads and passes image to ImageView. Now I need to hide button after few seconds after this operation when user is not doing any actions (eg. just looking on downloaded image). How can I achieve that?You can use Handler new Han

My self-generated & ldquo; dots & rdquo; glue at the bottom of the screen after a few seconds

So I have this site (http://mc.wordquest.nl/green/dots.html) and I want to make dots floating from the bottom of the page into the air. In the first few seconds, it works fine. But after a second or 5, the dots stay in their place. Click here for the

How can I edit this violin to close the animation after a few seconds?

How can I edit this fiddle to close the animation after few seconds? $('div').animate({left: 0}); div{ background: red; height: 100px; width: 100px; position: absolute; left: -100px; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11

disconnecting the connection after a few seconds in xmpp using openfire

i am using openfire 3.9 and strophe at client side , i am using http-bind too. Now the issues is , after i connect with a server and leave my application as it is , it disconnects after few seconds , like around 40 sec after it disconnects and it sen

Show / Hide div when the check box is selected

I need to make additional content appear when a user selects a checkbox. I have the following code: <!DOCTYPE html> <html> <head> <title>Checkbox</title> <script type="text/javascript"> $(document).ready(funct

Expiration of the session after a few seconds in Umbraco

I have created an site on Umbraco 7.1.6 it was working perfect in Visual studio 2012; when I deployed it to my hosting space I found a problem that it redirects me to login screen again and again just after some seconds. I have set keep user login to

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK