Fade in/out page on page load with internal links

Question

I have this script which fades in/out the page

(function($) {
  $(window).load(function() {
    $('#preloader').fadeOut();
    $('#wrap').fadeIn();


    $("a").click(function(event){
        event.preventDefault();
        linkLocation = this.href;
        $("#wrap").fadeOut(redirectPage);  
    });

    function redirectPage() {
        window.location = linkLocation;
    }

  });
})(jQuery);

But I have some external links which I don't want to effect so I don't want to target these.

I have found how to test for internal links using this script

var siteURL = "http://" + top.location.host.toString();
var internalLinks = $("a[href^='"+siteURL+"'], a[href^='/'], a[href^='./'], a[href^='../'], a[href^='#']");

But I'm really stuck on how to combine the two! Any ideas please?

score 0 · Answer 1 · answered Mar 11 '14 at 05:03

I think you use the regex,

Try this,

var patt = new RegExp('(\/|..\/|.\/|#|https:\/\/www.google.co.in)');
var $internalLinks = [];
$('a').each(function(index){
    if(patt.test($(this).attr('href'))){
 $(this).addClass('fadeclass');
};
})

$('input').click(function(){
$('.fadeclass').fadeOut('slow')
});

Demo JsFiddle

From the above code, I used the regular expression for match the href, when I mentioned external links found then I added the fadeclass. You can use fadeclass whatever.

Fade in/out page on page load with internal links

1 Answers1