Pages

Animate / function before go to the next page on link click - Jquery

Animate / function before go to the next page on link click - Jquery

<script>
    $(".mlink").click(function (e) {
        
        e.preventDefault();
        
        var link = $(this).attr('href');
        
        $('body').addClass('animated hinge').delay(3000).queue(function(){
            
//.delay(3000).queue - to delay next function

           location.href = link;            
          
        });
        });
</script>

or

<script>
$("#info-text-container").click(function(){
    setTimeout(function(){
       $("#info-text").addClass("info-text-active");
   }, 500);

});
</script>

Pure CSS3 JavaScript Pre loader without JQuery

Simple JavaScript pre-loader which works without the JQuery library created with CSS3 and JS.


<div id="spinner"> </div>

#spinner {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 999999999;
background: rgba(255,255,255,0.95);

}


<script type='text/javascript'>
  
  function attach(element,listener,ev,tf){

if(element.attachEvent) {

    element.attachEvent("on"+listener,ev);

}else{

    element.addEventListener(listener,ev,tf);

}

}

function fadeOut(element,startLevel,endLevel,duration,callback){

var fOInt;

    op = startLevel;

fOInt = setInterval(function() {

    if(op<=endLevel){

    element.style.opacity = endLevel;
    element.style.filter = "alpha(opacity = " + endLevel + ")";

    clearInterval(fOInt);

        if(typeof callback == 'function') callback(true);

    }else{

    op -= 0.1;

    element.style.opacity = op;
    element.style.filter = "alpha(opacity = " + op*100 + ")";

    }

    },duration);

}

attach(window,'load',function(){
    fadeOut(document.getElementById('spinner'),1,0,50,function(cb){
        
        document.getElementById("spinner").style.display = "none";

    //alert('The loader has faded out!')

    });
    
},false);
  
</script>

Print only a div in web page No CSS JS Only

Printing only a specific div in a web page using javascript with a print button




<script>
function printContent(el){
var restorepage = document.body.innerHTML;
var printcontent = document.getElementById(el).innerHTML;
document.body.innerHTML = printcontent;
window.print();
document.body.innerHTML = restorepage;
}
</script>


<button class="btn btn-info" onclick="printContent('print')"> <span class="glyphicon glyphicon-print" aria-hidden="true"></span> Print Content</button>

<div class="col-lg-12" id="print">
This content will be printed
</div>

SEO friendly redirect to a newly purchased domain

SEO friendly 301 redirect to a newly purchased domain . Redirect all old URLs of a domain (web site) in to a new domains (web site) URLs.

RewriteEngine on 
RewriteRule ^(.*)$ http://www.newdomain.com/$1 [R=301,L]

Adding a link click function on page load

Automatically adding a link's click function. Useful to load  a pop up or a lightbox plugin which works only on click function of a link.

$(document).ready(function() {
   $('#lightboxlink').click();
});


||

$(document).ready(function() {
   $('#lightboxlink').trigger("click");
});

Search This Blog