5 Cool javascript tricks 2015 for websites and Browser

Javascript is very broad and difficult language at all. ( for me may be not for you :p). With javascript we can add interactivity in our web pages and websites. Javascript has creates easiness for the designers and developers. In fact, javascript revolutionized the designing.

There are some little and cool javascript tricks by which you can do a lot of helpful works and add more interactivity to your website. I am not an expert of javascript nor an big blogger but I am the newbie and don't have enough experience. So, that's why sometimes I do a mistake in my writing. If you find any mistake then must inform me.

 Here in this article I have added 5 cool javascript tricks 2015 for websites and Browser. The javascript tricks included: Auto select text area, Add to favourite, async sharing buttons, notify the visitors when javascript on/off and last one different stylesheets for different days of week.

1# Auto Select Text Area

Sometimes we need to add some text or you can say a code for the users. So, for the easiness of the users this javascript snippet will help you. By this users can easily auto select the text area which they want to copy.

<textarea rows="10" cols="50" onclick="this.focus();this.select()" readonly="readonly">
   Your Text Here
</textarea>

2# Add to Favorite

The first param to AddFavorite is the URL, the second the text to offer up for saving. So this inline JavaScript is reusable in the sense that it will pull those values dynamically from the anchor link itself.

<a href="http://site.com" onclick="window.external.AddFavorite(this.href,this.innerHTML);">Add Favorite and Go-To-There</a>

3# Async Sharing Buttons

Many of these services are already running and provide their scripts in an asyc, but this snippet is just combine them in more easy and understandable code.

(function(doc, script) {
  var js,
      fjs = doc.getElementsByTagName(script)[0],
      frag = doc.createDocumentFragment(),
      add = function(url, id) {
          if (doc.getElementById(id)) {return;}
          js = doc.createElement(script);
          js.src = url;
          id && (js.id = id);
          frag.appendChild( js );
      };
   
    // Google+ button
    add('http://apis.google.com/js/plusone.js');
    // Facebook SDK
    add('//connect.facebook.net/en_US/all.js#xfbml=1&appId=200103733347528', 'facebook-jssdk');
    // Twitter SDK
    add('//platform.twitter.com/widgets.js');
    fjs.parentNode.insertBefore(frag, fjs);
}(document, 'script'));

 You will also need an HTML for this snippet to work. 

<a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
<div class="g-plusone" data-size="medium" data-count="true"></div>
<div id="fb-root"></div>
<div class="fb-like" data-send="false" data-layout="button_count" data-width="1" data-show-faces="false" data-action="recommend"></div>

4# Notify the Visitor when Javascript is ON/OFF

This is very helpful snippet to increase your usability. This snippet will tells the user weather the Javascript is on or off.If javascript is on then user gets a welcome message and if javascript is off then the user will be instructed to turn it on.

<script type="text/javascript">
   document.write("Welcome, you have Javascript on.")
</script>
<noscript>JavaScript is off. Please enable to view full site.</noscript>

 5# Different Stylesheets for Different Days

And here is the last one which I like most. Name your css files accordingly like: Saturday.css, Friday.css, Sunday.css, etc...

NOTE:If JavaScript is disabled in the browser, it will revert back to the default.css file.

<script type="text/javascript">
<!--
dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
dayNumber = new Date().getDay();
document.writeln('<link rel="stylesheet" type="text/css" href="' + dayNames[dayNumber] + '.css">');
//-->
</script>
<noscript>
<link rel="stylesheet" type="text/css" href="default.css">
</noscript>