23 grudnia 2016

Loader na blogu


Instrukcja jak wstawić loader na blogspota.

1. Wchodzimy w nasz kod HTML i szukamy za pomocą CTRL + F </body> i tuż NAD nim wklejamy:
<!-- jQuery Plugin -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
2. Następnie POD </body> wklejamy:
<!-- Preloader -->
<script type="text/javascript">
//<![CDATA[
$(window).load(function() { // makes sure the whole site is loaded
$('#status').fadeOut(); // will first fade out the loading animation
$('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website.
$('body').delay(350).css({'overflow':'visible'});
})
//]]>
</script>
3. Wyszukujemy </head>  i POD nim wklejamy:
<!-- Preloader -->
<div id="preloader">
<div id="status"></div>
</div>
4. Następnie wyszukujemy ]]></b:skin> i tuż nad nim wklejamy:
/* Preloader */
#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff;
    z-index:99999;
}
#status {
    width:200px;
    height:200px;
    position:absolute;
    left:50%;
    top:50%;
    background-image:url(LINK DO GIFA);
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px;
}
Czerwonym zaznaczyłam miejsce gdzie możemy wstawić dowolny loader a marginami zmieniamy jego położenie.

(c) blokotek 

Brak komentarzy:

Prześlij komentarz