Can't Apply Simple Hide Function On Div

EDIT: This is for leaning purpose I have jQuery library included in my header: In body I have simple div:

Solution 1:

load can be called on Body,iframe,img etc. but not on divs, Instead if you wish to use onload event on an element, you need to bind it with the element for eg. with div.But basically there are 2 ways to call a function 1. is to call function just after div load , write just after div element

<divid="image"><imgclass="width"src="assets/images/janka.jpg"></div><script>functiontoHide() { 
        $("#image").hide();         
    }
    toHide();
    </script>

2. is to fire function onload of img instead of div

    $("#image img").load(function () { 
                $("#image img").hide();     //USING JS function    
            });
        OR



         $("#image").load(function () { 
                $("#image").css('display', 'none');     //USING CSS   
            });

Solution 2:

The #image element is a div which does not raise the load event. You need to select the img element inside that which does raise the event:

$("#image img").load(function () { 
    $("#image").hide();         
});

Solution 3:

It should be img:

$("#image img").load(function () { 
        $("#image img").hide();         
    });

The load of the div can't be checked but images can be. If you want to hide div right after html is ready then use ready handler:

$(document).ready(function(){
 $('#image').hide();
});

But you're using the script at the end of closing body you just apply this:

$('#image').hide();

Share