HTML5: List of New Features

HTML5: List of New Features

1. In HTML5, there is only one declaration:

2. HTML5 is totally based on HTML, CSS, DOM, and JavaScript.

3. HTML5 includes new elements for better structure, better form handling, drawing, and for media content.

4. HTML5 has much more markups to replace scripting.

5. HTML5 has new form controls, like calendar, date, time, email, url, search.

6. HTML5 has new content-specific elements, like

7. Media Elements: HTML5 eliminates the need of Flash. HTML5 has added new media elements like

The control attribute adds audio controls, like play, pause, and volume.

You should also insert text content between the

tags for browsers that do not support the

The

8. Canvas Element: HTML5 has

The

You can use following javascript code to draw a 2 dimensional rectange and fill it with red color:

The default fillStyle is #000000 (black).

9. Local Storage: HTML5 supports local storage and replaces the need of cookies. With HTML5, web pages can store data locally within the user's browser.

Earlier, this was done with cookies. However, Web Storage is more secure and faster. The data is not included with every server request, but used ONLY when asked for. It is also possible to store large amounts of data, without affecting the website's performance. The data is stored in key/value pairs, and a web page can only access data stored by itself.

10. HTML5 Web Worker Feature: A web worker is a javaScript running in the background, without affecting the performance of the page. When executing scripts in an HTML page, the page becomes unresponsive until the script is finished. A web worker is a javaScript that runs in the background, independently of other scripts, without affecting the performance of the page. You can continue to do whatever you want: clicking, selecting things, etc., while the web worker runs in the background.

11. HTML Server-Sent Events(SSE) Feature(One Way Messages): A server-sent event is when a web page automatically gets updates from a server. This was also possible before, but the web page would have to ask if any updates were available. With server-sent events, the updates come automatically.

Examples: Facebook/Twitter updates, stock price updates, news feeds, sport results, etc.

12. HTML5 Application Cache Feature: HTML5 introduces application cache, which means that a web application is cached, and accessible without an internet connection.

Application cache gives an application three advantages:

Offline browsing - users can use the application when they're offline
Speed - cached resources load faster
Reduced server load - the browser will only download updated/changed resources from the server

13. Geolocation: HTML5 supports Geolocation API which is used to get the geographical position of a user.

14. Drag and Drop: HTML5 supports Drag and Drop feature.

15. SVG: HTML5 has support for inline SVG(Scalable Vector Graphics).

16. HTML5 is device independent.

17. HTML5 has better error handling.

18. Removed Elements: HTML5 has removed , , , , , , , , , , <strike> and <tt> elements.</div></span></div> <div div='adsense-content' style='display:block;text-align: center'> </div></div> <script type='text/javascript'> function insertAfter(addition,target) { var parent = target.parentNode; if (parent.lastChild == target) { parent.appendChild(addition); } else { parent.insertBefore(addition,target.nextSibling); } } var adscont = document.getElementById("adsense-content"); var target = document.getElementById("adsense-target"); var linebreak = target.getElementsByTagName("br"); if (linebreak.length > 0){ insertAfter(adscont,linebreak[1]); } </script> <script type='text/javascript'> function insertAfter2(addition2,target2) { var parent = target.parentNode; if (parent.lastChild == target) { parent.appendChild(addition); } else { parent.insertBefore(additionn,targett.nextSibling); } } var adscont = document.getElementById("adsense-content2"); var target = document.getElementById("adsense-target"); var linebreak = target.getElementsByTagName("br"); if (linebreak.length > 0){ insertAfter(adscont,linebreak[3]); } </script> </div> </div> </article> <div class='hreview' style='display:none'> <span class='item'> <span class='fn'>HTML5: List of New Features</span> <img alt='HTML5: List of New Features' class='photo' src=''/> </span> Reviewed by <span class='reviewer'>0x000216</span> on <span class='dtreviewed'> Thursday, October 18, 2012 <span class='value-title' title='Thursday, October 18, 2012'></span> </span> Rating: <span class='rating'>5</span> </div> <div style='clear:both'></div> <div class='post-footer'> <div class='label-head'> <span>Tags :</span> </div> <div class='share-art'> <a class='facebook' href='https://www.facebook.com/sharer.php?u=https://nexus-decode.blogspot.com/2012/10/html5-list-of-new-features.html&title=HTML5: List of New Features' onclick='window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;' rel='nofollow' target='_blank'><i class='fa fa-facebook'></i><span>Share it</span></a> <a class='twitter' href='https://twitter.com/share?url=https://nexus-decode.blogspot.com/2012/10/html5-list-of-new-features.html&title=HTML5: List of New Features' onclick='window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;' rel='nofollow' target='_blank'><i class='fa fa-twitter'></i><span>Tweet it</span></a> <a class='googleplus' href='https://plus.google.com/share?url=https://nexus-decode.blogspot.com/2012/10/html5-list-of-new-features.html&title=HTML5: List of New Features' onclick='window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;' rel='nofollow' target='_blank'><i class='fa fa-google-plus'></i><span>Share it</span></a> <a class='linkedin' href='https://www.linkedin.com/shareArticle?url=https://nexus-decode.blogspot.com/2012/10/html5-list-of-new-features.html&title=HTML5: List of New Features' onclick='window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i><span>Share it</span></a> <a class='pinterest' href='https://pinterest.com/pin/create/button/?url=https://nexus-decode.blogspot.com/2012/10/html5-list-of-new-features.html&media=&description=HTML5: List of New Features 1. In HTML5, there is only one declaration: 2. HTML5 is totally based on HTML, CSS, DOM, and JavaScript . 3...' onclick='window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i><span>Pin it</span></a> </div> <div style='clear:both'></div> <div id='related-posts'> <h4 class='related-headline'>You Might Also Like</h4> <div class='related-ready'> </div> </div> <script type='text/javascript'> var id_user = 329219; var domains_include = ['google.com', 'nexus-decode.blogspot.com.com', 'bing.com']; </script> <div class='clear'></div> <ul class='post-nav'> <li class='next'> <a class='newer-link' href='https://nexus-decode.blogspot.com/2012/10/mcafee-announces-new-data-center.html' id='Blog1_blog-pager-newer-link' rel='next'></a> </li> <li class='previous'> <a class='older-link' href='https://nexus-decode.blogspot.com/2012/10/persahabatan-monyet-kura-kura-dan-penyu.html' id='Blog1_blog-pager-older-link' rel='previous'></a> </li> </ul> </div> <div itemprop='publisher' itemscope='itemscope' itemtype='https://schema.org/Organization' style='display:none;'> <div itemprop='logo' itemscope='itemscope' itemtype='https://schema.org/ImageObject'> <meta content='' itemprop='url'/> </div> <meta content='Nexus' itemprop='name'/> </div> </div> </div> <script type='text/javascript'> //<![CDATA[ $(".index .post-outer,.archive .post-outer").each(function() { $(this).find(".block-image .thumb a").attr("style", function(e, t) { return t.replace("/default.jpg", "/mqdefault.jpg") }).attr("style", function(e, t) { return t.replace("s72-c", "s1600") }) }); //]]> </script> <div class='comments' id='comments'> <a name='comments'></a> <div id='backlinks-container'> <div id='Blog1_backlinks-container'> </div> </div> </div> </div>  </div> <div class='post-feeds'> </div> </div></div> </div> <div class='sidebar-wrapper'> <div class='sidebar section' id='sidebar' name='Sidebar Right A'> <div class='widget HTML' data-version='1' id='HTML4'> <h2 class='title'>Recent Posts</h2> <div class='widget-content'> </div> </div><div class='widget HTML' data-version='1' id='HTML8'> <h2 class='title'>Facebook</h2> <div class='widget-content'> </div> </div></div> </div> <div class='clear'></div> </div><center>  <script type='text/javascript'> var id_user = 329219; var domains_include = ['google.com', 'nexus-decode.blogspot.com.com', 'bing.com']; </script> </center> <div class='clear'></div> <div class='footer-wrapper'> <div class='footer-sec row'>  <div class='social-footer section' id='social-footer' name='Social Footer'><div class='widget LinkList' data-version='1' id='LinkList20'> <div class='widget-content'> <ul> <li><a class='gplus' href='#' target='_blank' title='gplus'></a></li> <li><a class='youtube' href='#' target='_blank' title='youtube'></a></li> <li><a class='instagram' href='#' target='_blank' title='instagram'></a></li> <li><a class='twitter' href='#' target='_blank' title='twitter'></a></li> <li><a class='facebook' href='#' target='_blank' title='facebook'></a></li> </ul> </div> </div></div>  <div class='copyright'><p>Created By <a href='https://nexus-decode.blogspot.com/' id='mycontent' title='Blogger Templates'>Nexus</a> · Powered by <a href='https://www.blogger.com'>Blogger</a> <br/>© All Rights Reserved</p> <a aria-current='page' href='https://nexus-decode.blogspot.com/p/terms-of-service-these-terms-and.html'>Terms Of Service </a>·<a href='https://nexus-decode.blogspot.com/p/privacy-policy.html'> Privacy Policy </a>·<a href='https://nexus-decode.blogspot.com/p/blog-page.html'> Disclaimer </a>·<a href='mailto:cybergeekofficial@gmail.com'> Contact Us </a>·<a href='https://nexus-decode.blogspot.com/p/about-us.html'> About Us </a></div> </div> </div> <script> /*<![CDATA[*/ $(function() { $('.widget.LinkList a[href*="behance.net"] i').addClass("fa fa-behance"); $('.widget.LinkList a[href*="facebook.com"] i').addClass("fa fa-facebook"); $('.widget.LinkList a[href*="twitter.com"] i').addClass("fa fa-twitter"); $('.widget.LinkList a[href*="bloglovin.com"] i').addClass("fa fa-heart"); $('.widget.LinkList a[href*="dribbble.com"] i').addClass("fa fa-dribbble"); $('.widget.LinkList a[href*="flickr.com"] i').addClass("fa fa-flickr"); $('.widget.LinkList a[href*="snapchat.com"] i').addClass("fa fa-snapchat"); $('.widget.LinkList a[href*="plus.google.com"] i').addClass("fa fa-google-plus"); $('.widget.LinkList a[href*="instagram.com"] i').addClass("fa fa-instagram"); $('.widget.LinkList a[href*="linkedin.com"] i').addClass("fa fa-linkedin"); $('.widget.LinkList a[href*="pinterest.com"] i').addClass("fa fa-pinterest"); $('.widget.LinkList a[href*="vimeo.com"] i').addClass("fa fa-vimeo-square"); $('.widget.LinkList a[href*="youtube.com"] i').addClass("fa fa-youtube"); $('.widget.LinkList a[href*="vine.co"] i').addClass("fa fa-vine"); $('.widget.LinkList a[href*="soundcloud.com"] i').addClass("fa fa-soundcloud"); $('.widget.LinkList a[href*="goodreads.com"] i').addClass("fa fa-book"); $('.widget.LinkList a[href*="deviantart.com"] i').addClass("fa fa-deviantart"); $('.widget.LinkList a[href*="foursquare.com"] i').addClass("fa fa-foursquare"); $('.widget.LinkList a[href*="reddit.com"] i').addClass("fa fa-reddit"); $('.widget.LinkList a[href*="tumblr.com"] i').addClass("fa fa-tumblr"); $('.widget.LinkList a[href*="spotify.com"] i').addClass("fa fa-spotify"); $('.widget.LinkList a[href*="twitch.tv"] i').addClass("fa fa-twitch"); $('.widget.LinkList a[href*="vk.com"] i').addClass("fa fa-vk"); $('.widget.LinkList a[href*="mailto"] i').addClass("fa fa-envelope"); $('.widget.LinkList a[href*="shop"] i').addClass("fa fa-shopping-cart"); $('.widget.LinkList a[href*="feeds/posts/default"] i').addClass("fa fa-rss"); $('.widget.LinkList a[href*="feeds/comments/default"] i').addClass("fa fa-rss"); $('.widget.LinkList a[href*="feeds.feedburner.com"] i').addClass("fa fa-rss"); $('.widget.LinkList a[href*="etsy.com"] i').addClass("fa fa-shopping-cart"); $('.widget.LinkList a[href*="etsy.com"] i').addClass("fa fa-shopping-cart"); $('.widget.LinkList a[href*="behance.net"]').addClass("behance"); $('.widget.LinkList a[href*="facebook.com"]').addClass("facebook"); $('.widget.LinkList a[href*="twitter.com"]').addClass("twitter"); $('.widget.LinkList a[href*="bloglovin.com"]').addClass("bloglovin"); $('.widget.LinkList a[href*="dribbble.com"]').addClass("dribbble"); $('.widget.LinkList a[href*="flickr.com"]').addClass("flickr"); $('.widget.LinkList a[href*="snapchat.com"]').addClass("snapchat"); $('.widget.LinkList a[href*="plus.google.com"]').addClass("google-plus"); $('.widget.LinkList a[href*="instagram.com"]').addClass("instagram"); $('.widget.LinkList a[href*="linkedin.com"]').addClass("linkedin"); $('.widget.LinkList a[href*="pinterest.com"]').addClass("pinterest"); $('.widget.LinkList a[href*="vimeo.com"]').addClass("vimeo"); $('.widget.LinkList a[href*="youtube.com"]').addClass("youtube"); $('.widget.LinkList a[href*="vine.co"]').addClass("vine"); $('.widget.LinkList a[href*="soundcloud.com"]').addClass("soundcloud"); $('.widget.LinkList a[href*="reddit.com"]').addClass("reddit"); $('.widget.LinkList a[href*="vk.com"]').addClass("vk"); $('.widget.LinkList a[href*="facebook.com"] span').replaceWith("<span>like</span>") }); /*]]>*/ </script> <script type='text/javascript'> //<![CDATA[ // Reading Time Author ! function(e) { e.fn.readingTime = function(n) { var t = { readingTimeTarget: ".eta", wordCountTarget: null, wordsPerMinute: 270, round: !0, lang: "en", lessThanAMinuteString: "", prependTimeString: "", prependWordString: "", remotePath: null, remoteTarget: null, success: function() {}, error: function() {} }, i = this, r = e(this); i.settings = e.extend({}, t, n); var a = i.settings; if (!this.length) return a.error.call(this), this; if ("it" == a.lang) var s = a.lessThanAMinuteString || "Meno di un minuto", l = "minute"; else if ("fr" == a.lang) var s = a.lessThanAMinuteString || "Moins d'une minute", l = "minute"; else if ("de" == a.lang) var s = a.lessThanAMinuteString || "Weniger als eine Minute", l = "minute"; else if ("es" == a.lang) var s = a.lessThanAMinuteString || "Menos de un minuto", l = "minute"; else if ("nl" == a.lang) var s = a.lessThanAMinuteString || "Minder dan een minuut", l = "minute"; else if ("sk" == a.lang) var s = a.lessThanAMinuteString || "Menej než minútu", l = "minute"; else if ("cz" == a.lang) var s = a.lessThanAMinuteString || "Méně než minutu", l = "minute"; else if ("hu" == a.lang) var s = a.lessThanAMinuteString || "Kevesebb mint egy perc", l = "perc"; else var s = a.lessThanAMinuteString || "Less than a minute", l = "minute"; var u = function(n) { if ("" !== n) { var t = n.trim().split(/\s+/g).length, i = a.wordsPerMinute / 60, r = t / i; if (a.round === !0) var u = Math.round(r / 60); else var u = Math.floor(r / 60); var g = Math.round(r - 60 * u); if (a.round === !0) e(a.readingTimeTarget).text(u > 0 ? a.prependTimeString + u + " " + l : a.prependTimeString + s); else { var o = u + ":" + g; e(a.readingTimeTarget).text(a.prependTimeString + o) } "" !== a.wordCountTarget && void 0 !== a.wordCountTarget && e(a.wordCountTarget).text(a.prependWordString + t), a.success.call(this) } else a.error.call(this, "The element is empty.") }; r.each(function() { null != a.remotePath && null != a.remoteTarget ? e.get(a.remotePath, function(n) { u(e("<div>").html(n).find(a.remoteTarget).text()) }) : u(r.text()) }) } }(jQuery); $('.post').each(function() { $(this).readingTime({ readingTimeTarget: $(this).find('.eta'), remotePath: $(this).attr('data-file'), remoteTarget: $(this).attr('data-target') }); }); $('.post').readingTime(); //]]> </script> <style> .eta{ display: inline-block; padding-right: 5px; } </style>  <script> //<![CDATA[ windowWidth = window.innerWidth; //]]> </script> <script> //<![CDATA[ // jquery replacetext plugin (function(e) { e.fn.replaceText = function(t, n, r) { return this.each(function() { var i = this.firstChild, s, o, u = []; if (i) { do { if (i.nodeType === 3) { s = i.nodeValue; o = s.replace(t, n); if (o !== s) { if (!r && /</.test(o)) { e(i).before(o); u.push(i) } else { i.nodeValue = o } } } } while (i = i.nextSibling) } u.length && e(u).remove() }) } })(jQuery); // Timeago jQuery plugin (function(e) { if (typeof define === "function" && define.amd) { define(["jquery"], e) } else { e(jQuery) } })(function(e) { function r() { var n = i(this); var r = t.settings; if (!isNaN(n.datetime)) { if (r.cutoff == 0 || Math.abs(o(n.datetime)) < r.cutoff) { e(this).text(s(n.datetime)) } } return this } function i(n) { n = e(n); if (!n.data("timeago")) { n.data("timeago", { datetime: t.datetime(n) }); var r = e.trim(n.text()); if (t.settings.localeTitle) { n.attr("title", n.data("timeago").datetime.toLocaleString()) } else if (r.length > 0 && !(t.isTime(n) && n.attr("title"))) { n.attr("title", r) } } return n.data("timeago") } function s(e) { return t.inWords(o(e)) } function o(e) { return (new Date).getTime() - e.getTime() } e.timeago = function(t) { if (t instanceof Date) { return s(t) } else if (typeof t === "string") { return s(e.timeago.parse(t)) } else if (typeof t === "number") { return s(new Date(t)) } else { return s(e.timeago.datetime(t)) } }; var t = e.timeago; e.extend(e.timeago, { settings: { refreshMillis: 6e4, allowPast: true, allowFuture: false, localeTitle: false, cutoff: 0, strings: { prefixAgo: null, prefixFromNow: null, suffixAgo: "ago", suffixFromNow: "from now", inPast: "in a moment", seconds: "a few seconds", minute: "%d minute", minutes: "%d mins", hour: "%d hour", hours: "%d hrs", day: "%d day", days: "%d days", month: "month", months: "%d months", year: "%d year", years: "%d years", wordSeparator: " ", numbers: [] } }, inWords: function(t) { function l(r, i) { var s = e.isFunction(r) ? r(i, t) : r; var o = n.numbers && n.numbers[i] || i; return s.replace(/%d/i, o) } if (!this.settings.allowPast && !this.settings.allowFuture) { throw "timeago allowPast and allowFuture settings can not both be set to false." } var n = this.settings.strings; var r = n.prefixAgo; var i = n.suffixAgo; if (this.settings.allowFuture) { if (t < 0) { r = n.prefixFromNow; i = n.suffixFromNow } } if (!this.settings.allowPast && t >= 0) { return this.settings.strings.inPast } var s = Math.abs(t) / 1e3; var o = s / 60; var u = o / 60; var a = u / 24; var f = a / 365; var c = s < 45 && l(n.seconds, Math.round(s)) || s < 90 && l(n.minute, 1) || o < 45 && l(n.minutes, Math.round(o)) || o < 90 && l(n.hour, 1) || u < 24 && l(n.hours, Math.round(u)) || u < 42 && l(n.day, 1) || a < 30 && l(n.days, Math.round(a)) || a < 45 && l(n.month, 1) || a < 365 && l(n.months, Math.round(a / 30)) || f < 1.5 && l(n.year, 1) || l(n.years, Math.round(f)); var h = n.wordSeparator || ""; if (n.wordSeparator === undefined) { h = " " } return e.trim([r, c, i].join(h)) }, parse: function(t) { var n = e.trim(t); n = n.replace(/\.\d+/, ""); n = n.replace(/-/, "/").replace(/-/, "/"); n = n.replace(/T/, " ").replace(/Z/, " UTC"); n = n.replace(/([\+\-]\d\d)\:?(\d\d)/, " $1$2"); n = n.replace(/([\+\-]\d\d)$/, " $100"); return new Date(n) }, datetime: function(n) { var r = t.isTime(n) ? e(n).attr("datetime") : e(n).attr("title"); return t.parse(r) }, isTime: function(t) { return e(t).get(0).tagName.toLowerCase() === "time" } }); var n = { init: function() { var n = e.proxy(r, this); n(); var i = t.settings; if (i.refreshMillis > 0) { this._timeagoInterval = setInterval(n, i.refreshMillis) } }, update: function(n) { var i = t.parse(n); e(this).data("timeago", { datetime: i }); if (t.settings.localeTitle) e(this).attr("title", i.toLocaleString()); r.apply(this) }, updateFromDOM: function() { e(this).data("timeago", { datetime: t.parse(t.isTime(this) ? e(this).attr("datetime") : e(this).attr("title")) }); r.apply(this) }, dispose: function() { if (this._timeagoInterval) { window.clearInterval(this._timeagoInterval); this._timeagoInterval = null } } }; e.fn.timeago = function(e, t) { var r = e ? n[e] : n.init; if (!r) { throw new Error("Unknown function name '" + e + "' for timeago") } this.each(function() { r.call(this, t) }); return this }; document.createElement("abbr"); document.createElement("time") }); // SelectNav window.selectnav = function() { "use strict"; var e = function(e, t) { function c(e) { var t; if (!e) e = window.event; if (e.target) t = e.target; else if (e.srcElement) t = e.srcElement; if (t.nodeType === 3) t = t.parentNode; if (t.value) window.location.href = t.value } function h(e) { var t = e.nodeName.toLowerCase(); return t === "ul" || t === "ol" } function p(e) { for (var t = 1; document.getElementById("selectnav" + t); t++); return e ? "selectnav" + t : "selectnav" + (t - 1) } function d(e) { a++; var t = e.children.length, n = "", l = "", c = a - 1; if (!t) { return } if (c) { while (c--) { l += o } l += " " } for (var v = 0; v < t; v++) { var m = e.children[v].children[0]; if (typeof m !== "undefined") { var g = m.innerText || m.textContent; var y = ""; if (r) { y = m.className.search(r) !== -1 || m.parentNode.className.search(r) !== -1 ? f : "" } if (i && !y) { y = m.href === document.URL ? f : "" } n += '<option value="' + m.href + '" ' + y + ">" + l + g + "</option>"; if (s) { var b = e.children[v].children[1]; if (b && h(b)) { n += d(b) } } } } if (a === 1 && u) { n = '<option value="">' + u + "</option>" + n } if (a === 1) { n = '<select class="selectnav" id="' + p(true) + '">' + n + "</select>" } a--; return n } e = document.getElementById(e); if (!e) { return } if (!h(e)) { return } if (!("insertAdjacentHTML" in window.document.documentElement)) { return } document.documentElement.className += " js"; var n = t || {}, r = n.activeclass || "active", i = typeof n.autoselect === "boolean" ? n.autoselect : true, s = typeof n.nested === "boolean" ? n.nested : true, o = n.indent || "→", u = n.label || "Menu", a = 0, f = " selected "; e.insertAdjacentHTML("afterend", d(e)); var l = document.getElementById(p()); if (l.addEventListener) { l.addEventListener("change", c) } if (l.attachEvent) { l.attachEvent("onchange", c) } return l }; return function(t, n) { e(t, n) } }(); $(document).ready(function() { selectnav('nav'); selectnav('nav1'); }); // Tabslet jQuery plugin (function($, window, undefined) { $.fn.tabslet = function(options) { var defaults = { mouseevent: "click", attribute: "href", animation: false, autorotate: false, pauseonhover: true, delay: 500, active: 1, controls: { prev: ".prev", next: ".next" } }; var options = $.extend(defaults, options); return this.each(function() { var $this = $(this); options.mouseevent = $this.data("mouseevent") || options.mouseevent; options.attribute = $this.data("attribute") || options.attribute; options.animation = $this.data("animation") || options.animation; options.autorotate = $this.data("autorotate") || options.autorotate; options.pauseonhover = $this.data("pauseonhover") || options.pauseonhover; options.delay = $this.data("delay") || options.delay; options.active = $this.data("active") || options.active; $this.find("> div").hide(); $this.find("> div").eq(options.active - 1).show(); $this.find("> ul li").eq(options.active - 1).addClass("active"); var fn = eval(function() { $(this).trigger("_before"); $this.find("> ul li").removeClass("active"); $(this).addClass("active"); $this.find("> div").hide(); var currentTab = $(this).find("a").attr(options.attribute); if (options.animation) { $this.find(currentTab).animate({ opacity: "show" }, "slow", function() { $(this).trigger("_after") }) } else { $this.find(currentTab).show(); $(this).trigger("_after") } return false }); var init = eval("$this.find('> ul li')." + options.mouseevent + "(fn)"); init; var elements = $this.find("> ul li"), i = options.active - 1; function forward() { i = ++i % elements.length; options.mouseevent == "hover" ? elements.eq(i).trigger("mouseover") : elements.eq(i).click(); var t = setTimeout(forward, options.delay); $this.mouseover(function() { if (options.pauseonhover) { clearTimeout(t) } }) } if (options.autorotate) { setTimeout(forward, 0); if (options.pauseonhover) { $this.on("mouseleave", function() { setTimeout(forward, 1000) }) } } function move(direction) { if (direction == "forward") { i = ++i % elements.length } if (direction == "backward") { i = --i % elements.length } elements.eq(i).click() } $this.find(options.controls.next).click(function() { move("forward") }); $this.find(options.controls.prev).click(function() { move("backward") }); $this.on("destroy", function() { $(this).removeData() }) }) }; $(document).ready(function() { $('[data-toggle="tabslet"]').tabslet() }) })(jQuery); // Simple Tab JQuery Plugin by Taufik Nurrohman (function(a) { a.fn.simplyTab = function(b) { b = jQuery.extend({ active: 1, fx: null, showSpeed: 400, hideSpeed: 400, showEasing: null, hideEasing: null, show: function() {}, hide: function() {}, change: function() {} }, b); return this.each(function() { var e = a(this), c = e.children("[data-tab]"), d = b.active - 1; e.addClass("simplyTab").prepend('<ul class="wrap-tab"></ul>'); c.addClass("content-tab").each(function() { a(this).hide(); e.find(".wrap-tab").append('<li><a href="#">' + a(this).data("tab") + "</a></li>") }).eq(d).show(); e.find(".wrap-tab a").on("click", function() { var f = a(this).parent().index(); a(this).closest(".wrap-tab").find(".activeTab").removeClass("activeTab"); a(this).addClass("activeTab"); if (b.fx == "slide") { if (c.eq(f).is(":hidden")) { c.slideUp(b.hideSpeed, b.hideEasing, function() { b.hide.call(e) }).eq(f).slideDown(b.showSpeed, b.showEasing, function() { b.show.call(e) }) } } else { if (b.fx == "fade") { if (c.eq(f).is(":hidden")) { c.hide().eq(f).fadeIn(b.showSpeed, b.showEasing, function() { b.show.call(e) }) } } else { if (b.fx == "fancyslide") { if (c.eq(f).is(":hidden")) { c.slideUp(b.hideSpeed, b.hideEasing, function() { b.hide.call(e) }).eq(f).delay(b.hideSpeed).slideDown(b.showSpeed, b.showEasing, function() { b.show.call(e) }) } } else { if (c.eq(f).is(":hidden")) { c.hide().eq(f).show() } } } } b.change.call(e); return false }).eq(d).addClass("activeTab") }) } })(jQuery); // SmoothScroll for websites v1.2.1 ! function() { function e() { var e = !1; e && c("keydown", r), v.keyboardSupport && !e && u("keydown", r) } function t() { if (document.body) { var t = document.body, o = document.documentElement, n = window.innerHeight, r = t.scrollHeight; if (S = document.compatMode.indexOf("CSS") >= 0 ? o : t, w = t, e(), x = !0, top != self) y = !0; else if (r > n && (t.offsetHeight <= n || o.offsetHeight <= n)) { var a = !1, i = function() { a || o.scrollHeight == document.height || (a = !0, setTimeout(function() { o.style.height = document.height + "px", a = !1 }, 500)) }; if (o.style.height = "auto", setTimeout(i, 10), S.offsetHeight <= n) { var l = document.createElement("div"); l.style.clear = "both", t.appendChild(l) } } v.fixedBackground || b || (t.style.backgroundAttachment = "scroll", o.style.backgroundAttachment = "scroll") } } function o(e, t, o, n) { if (n || (n = 1e3), d(t, o), 1 != v.accelerationMax) { var r = +new Date, a = r - C; if (a < v.accelerationDelta) { var i = (1 + 30 / a) / 2; i > 1 && (i = Math.min(i, v.accelerationMax), t *= i, o *= i) } C = +new Date } if (M.push({ x: t, y: o, lastX: 0 > t ? .99 : -.99, lastY: 0 > o ? .99 : -.99, start: +new Date }), !T) { var l = e === document.body, u = function() { for (var r = +new Date, a = 0, i = 0, c = 0; c < M.length; c++) { var s = M[c], d = r - s.start, f = d >= v.animationTime, h = f ? 1 : d / v.animationTime; v.pulseAlgorithm && (h = p(h)); var m = s.x * h - s.lastX >> 0, w = s.y * h - s.lastY >> 0; a += m, i += w, s.lastX += m, s.lastY += w, f && (M.splice(c, 1), c--) } l ? window.scrollBy(a, i) : (a && (e.scrollLeft += a), i && (e.scrollTop += i)), t || o || (M = []), M.length ? E(u, e, n / v.frameRate + 1) : T = !1 }; E(u, e, 0), T = !0 } } function n(e) { x || t(); var n = e.target, r = l(n); if (!r || e.defaultPrevented || s(w, "embed") || s(n, "embed") && /\.pdf/i.test(n.src)) return !0; var a = e.wheelDeltaX || 0, i = e.wheelDeltaY || 0; return a || i || (i = e.wheelDelta || 0), !v.touchpadSupport && f(i) ? !0 : (Math.abs(a) > 1.2 && (a *= v.stepSize / 120), Math.abs(i) > 1.2 && (i *= v.stepSize / 120), o(r, -a, -i), void e.preventDefault()) } function r(e) { var t = e.target, n = e.ctrlKey || e.altKey || e.metaKey || e.shiftKey && e.keyCode !== H.spacebar; if (/input|textarea|select|embed/i.test(t.nodeName) || t.isContentEditable || e.defaultPrevented || n) return !0; if (s(t, "button") && e.keyCode === H.spacebar) return !0; var r, a = 0, i = 0, u = l(w), c = u.clientHeight; switch (u == document.body && (c = window.innerHeight), e.keyCode) { case H.up: i = -v.arrowScroll; break; case H.down: i = v.arrowScroll; break; case H.spacebar: r = e.shiftKey ? 1 : -1, i = -r * c * .9; break; case H.pageup: i = .9 * -c; break; case H.pagedown: i = .9 * c; break; case H.home: i = -u.scrollTop; break; case H.end: var d = u.scrollHeight - u.scrollTop - c; i = d > 0 ? d + 10 : 0; break; case H.left: a = -v.arrowScroll; break; case H.right: a = v.arrowScroll; break; default: return !0 } o(u, a, i), e.preventDefault() } function a(e) { w = e.target } function i(e, t) { for (var o = e.length; o--;) z[N(e[o])] = t; return t } function l(e) { var t = [], o = S.scrollHeight; do { var n = z[N(e)]; if (n) return i(t, n); if (t.push(e), o === e.scrollHeight) { if (!y || S.clientHeight + 10 < o) return i(t, document.body) } else if (e.clientHeight + 10 < e.scrollHeight && (overflow = getComputedStyle(e, "").getPropertyValue("overflow-y"), "scroll" === overflow || "auto" === overflow)) return i(t, e) } while (e = e.parentNode) } function u(e, t, o) { window.addEventListener(e, t, o || !1) } function c(e, t, o) { window.removeEventListener(e, t, o || !1) } function s(e, t) { return (e.nodeName || "").toLowerCase() === t.toLowerCase() } function d(e, t) { e = e > 0 ? 1 : -1, t = t > 0 ? 1 : -1, (k.x !== e || k.y !== t) && (k.x = e, k.y = t, M = [], C = 0) } function f(e) { if (e) { e = Math.abs(e), D.push(e), D.shift(), clearTimeout(A); var t = D[0] == D[1] && D[1] == D[2], o = h(D[0], 120) && h(D[1], 120) && h(D[2], 120); return !(t || o) } } function h(e, t) { return Math.floor(e / t) == e / t } function m(e) { var t, o, n; return e *= v.pulseScale, 1 > e ? t = e - (1 - Math.exp(-e)) : (o = Math.exp(-1), e -= 1, n = 1 - Math.exp(-e), t = o + n * (1 - o)), t * v.pulseNormalize } function p(e) { return e >= 1 ? 1 : 0 >= e ? 0 : (1 == v.pulseNormalize && (v.pulseNormalize /= m(1)), m(e)) } var w, g = { frameRate: 150, animationTime: 800, stepSize: 120, pulseAlgorithm: !0, pulseScale: 8, pulseNormalize: 1, accelerationDelta: 20, accelerationMax: 1, keyboardSupport: !0, arrowScroll: 50, touchpadSupport: !0, fixedBackground: !0, excluded: "" }, v = g, b = !1, y = !1, k = { x: 0, y: 0 }, x = !1, S = document.documentElement, D = [120, 120, 120], H = { left: 37, up: 38, right: 39, down: 40, spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36 }, v = g, M = [], T = !1, C = +new Date, z = {}; setInterval(function() { z = {} }, 1e4); var A, N = function() { var e = 0; return function(t) { return t.uniqueID || (t.uniqueID = e++) } }(), E = function() { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || function(e, t, o) { window.setTimeout(e, o || 1e3 / 60) } }(), K = /chrome/i.test(window.navigator.userAgent), L = "onmousewheel" in document; L && K && (u("mousedown", a), u("mousewheel", n), u("load", t)) }(); //]]> </script> <script type='text/javascript'> //<![CDATA[ /*GLOBAL SETTINGS, USER CAN CHANGE*/ var MONTH_FORMAT = [, "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]; var NO_IMAGE = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhniDK1OpVdzXGnh-gpgZmzP_TmSYSGZP1fs_PRJOj0YbdnJT0CHi6stxcTIFbqRLe-6aKSWCwbVbwXJcraM7fB42CLn2AY1WDfvD1mp2yITurW7zUqkK0EdkBojg3yL4M3QqChfTCoPb4/s1600-r/nth.png"; var POST_PER_PAGE = 9; // number of posts per page "navigation" var LABEL_SEARCH_NUM = 9; // number of posts labels search var POSTNAV_PREV_TEXT = "Previous"; // post nav text "previous post" var POSTNAV_NEXT_TEXT = "Next"; // post nav text "next post" var COMMENTS_TEXT = "Leave a Comment"; // comments text "leave a comment" // Main Scripts $("#LinkList110").each(function() { var e = "<ul id='nav'><li><ul id='sub-menu'>"; $("#LinkList110 li").each(function() { var t = $(this).text(), n = t.substr(0, 1), r = t.substr(1); "_" == n ? (n = $(this).find("a").attr("href"), e += '<li><a href="' + n + '">' + r + "</a></li>") : (n = $(this).find("a").attr("href"), e += '</ul></li><li><a href="' + n + '">' + t + "</a><ul id='sub-menu'>") }); e += "</ul></li></ul>"; $(this).html(e); $("#LinkList110 ul").each(function() { var e = $(this); if (e.html().replace(/\s| /g, "").length == 0) e.remove() }); $("#LinkList110 li").each(function() { var e = $(this); if (e.html().replace(/\s| /g, "").length == 0) e.remove() }) }); $(document).ready(function() { $(".cmm-tabs").simplyTab({ active: 1, fx: "fade", showSpeed: 400, hideSpeed: 400 }); $("#slink").click(function() { $('#searchbar').toggle() }); $('.blogger-tab').append($('#comments')); $(".cmm-tabs.simplyTab .wrap-tab").wrap("<div class='cmm-tabs-header'/>"); $('.cmm-tabs-header').prepend('<h3>' + COMMENTS_TEXT + '</h3>'); $("#menu").show(); $("ul#sub-menu").parent("li").addClass("hasSub"); $("abbr.timeago").timeago(); $(".footer-sections .widget h2").wrap("<div class='widget-title'/>"); $(".index .post-outer,.archive .post-outer").each(function() { $(this).find(".block-image .thumb a").attr("style", function(e, t) { return t.replace("/default.jpg", "/mqdefault.jpg") }).attr("style", function(e, t) { return t.replace("s72-c", "s1600") }) }); $('.PopularPosts ul li img').each(function() { $(this).attr('src', function(i, src) { return src.replace('/default.jpg', '/mqdefault.jpg') }).attr('src', function(i, src) { return src.replace('s72-c', 's1600') }).attr('src', function(i, src) { return src.replace('w72-h72-p-nu', 's1600') }) }); $(window).scroll(function() { if ($(this).scrollTop() > 200) { $('#back-to-top').fadeIn() } else { $('#back-to-top').fadeOut() } }); $('#back-to-top').hide().click(function() { $('html, body').animate({ scrollTop: 0 }, 800); return false }); var tab1 = $("#sidebar_tabs #tab1 .widget h2").text(); $(".tab-opt .opt-1 a").text(tab1); var tab2 = $("#sidebar_tabs #tab2 .widget h2").text(); $(".tab-opt .opt-2 a").text(tab2); var tab3 = $("#sidebar_tabs #tab3 .widget h2").text(); $(".tab-opt .opt-3 a").text(tab3); $("#tab1 .widget h2,#tab2 .widget h2,#tab3 .widget h2,#tab1 .widget-title,#tab2 .widget-title,#tab3 .widget-title").remove(); $(".sidebar_tabs").tabslet({ mouseevent: "click", attribute: "href", animation: true }); if ($(".sidebar_tabs .widget").length === 0) { $(".sidebar_tabs").remove() } }); $(document).ready(function(a) { var b = a("a.newer-link"); var c = a("a.older-link"); a.get(b.attr("href"), function(c) { b.html("<strong>" + POSTNAV_NEXT_TEXT + "</strong><span>" + a(c).find(".post h1.post-title").text() + "</span>") }, "html"); a.get(c.attr("href"), function(b) { c.html("<strong>" + POSTNAV_PREV_TEXT + "</strong><span>" + a(b).find(".post h1.post-title").text() + "</span>") }, "html") }); $(window).bind("load", function() { $('.box-title h2 a,.Label a,.postags a,.label-head a').each(function() { var labelPage = $(this).attr('href'); $(this).attr('href', labelPage + '?&max-results=' + LABEL_SEARCH_NUM + '') }) }); $(".related-ready").each(function() { var b = $(this).text(); $.ajax({ url: "/feeds/posts/default/-/" + b + "?alt=json-in-script&max-results=3", type: 'get', dataType: "jsonp", success: function(e) { var u = ""; var h = '<div class="related">'; for (var i = 0; i < e.feed.entry.length; i++) { for (var j = 0; j < e.feed.entry[i].link.length; j++) { if (e.feed.entry[i].link[j].rel == "alternate") { u = e.feed.entry[i].link[j].href; break } } var g = e.feed.entry[i].title.$t; var c = e.feed.entry[i].content.$t; var $c = $('<div>').html(c); if (c.indexOf("//www.youtube.com/embed/") > -1) { var p = e.feed.entry[i].media$thumbnail.url; var k = p } else if (c.indexOf("<img") > -1) { var q = $c.find('img:first').attr('src'); var k = q } else { var k = NO_IMAGE } h += '<li><div class="related-thumb"><a class="related-img" href="' + u + '" style="background:url(' + k + ') no-repeat center center;background-size: cover"/></div><h3 class="related-title"><a href="' + u + '">' + g + '</a></h3></li>' } h += '</div><div class="clear"/>'; $(".related-ready").html(h); $('.related-img').each(function() { $(this).attr('style', function(i, src) { return src.replace('/default.jpg', '/hqdefault.jpg') }).attr('style', function(i, src) { return src.replace('s72-c', 's1600') }) }) } }) }); window.onload = function() { var e = document.getElementById("mycontent"); if (e == null) { window.location.href = "https://nexus-decode.blogspot.com/" } e.setAttribute("href", "https://nexus-decode.blogspot.com/"); e.setAttribute("ref", "dofollow"); e.setAttribute("title", "Blogger Templates"); e.setAttribute("style", "display: inline-block!important; font-size: inherit!important; color: #888!important; visibility: visible!important; opacity: 1!important;"); e.innerHTML = "Nexus" } //]]> </script> <script type='text/javascript'> var postperpage=POST_PER_PAGE; var numshowpage=5; var upPageWord ='Prev'; var downPageWord ='Next'; var urlactivepage=location.href; var home_page="/"; </script> <div class='back-to-top'> <a href='#' id='back-to-top' title='Back to Top'><i class='fa fa-long-arrow-up'></i></a> </div> </body> </html>