HTML cơ bản

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNz_KepiCdv5JilmaidwUsa71fnmxL4xBU9wzqUfwcA6-w7lj04yd6oiAWA2xqK5G-lICgRCIMyJIeChMU-Y6K5Fu5gJ6x_U4YMXmzUl7BwjX0m-BrUaLYdjE75rIUOoKcz1cPKYAd1imv/s1600/HTML+-+vusteven.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNz_KepiCdv5JilmaidwUsa71fnmxL4xBU9wzqUfwcA6-w7lj04yd6oiAWA2xqK5G-lICgRCIMyJIeChMU-Y6K5Fu5gJ6x_U4YMXmzUl7BwjX0m-BrUaLYdjE75rIUOoKcz1cPKYAd1imv/s1600/HTML+-+vusteven.jpg" /></a></div><b><br /></b><br /><b><br /></b><br /><b>HTML các tiêu đề</b><br /><br /><b><br /></b><br />Tiêu đề HTML được định nghĩa với <h1> để <h6> thẻ.<br /><br /><br /><br />Ví dụ:<br /><br /><h1>Đây là một tiêu đề</h1><br /><br /><h2>Đây là một tiêu đề</h2><br /><br /><h3>Đây là một tiêu đề</h3><br /><br /><br /><br /><b>HTML Paragraphs ( HTML khoản )</b><br /><br /><b><br /></b><br />Đoạn HTML được định nghĩa với <p>.<br /><br /><br /><br /><p>Đây là một đoạn</p><br /><br /><p>Đây là một đoạn</p><br /><br /><br /><br /><b>HTML Links ( Liên kết HTML )</b><br /><br /><b><br /></b><br />HTML liên kết được định nghĩa với các từ khóa <a>.<br /><br /><br /><br /><pre><a href="http://www.vusteven.info">Đây là một liên kết</a><br /></pre><pre></pre><pre><b>Chú ý</b>: <b>Các địa chỉ liên kết được quy định trong các thuộc tính href.</b><b>(Bạn sẽ tìm hiểu về các thuộc tính trong một chương sau của hướng dẫn này)</b></pre><pre><b><br /></b></pre><b>HTML Images ( HTML hình ảnh )</b><br /><br />Hình ảnh HTML được định nghĩa với thẻ <img><br /><br /><br /><br /><pre><img src="vusteven.jpg" alt="vusteven.info" <b><span style="color: red;">width="104"</span></b> <span style="color: red;"><b>height="142"</b></span>><br /></pre><pre></pre><pre>Chú ý: Các tên tập tin và kích thước của hình ảnh được cung cấp như là thuộc tính</pre><pre></pre>

• 
• 

1. 1
2. 2
3. 3

• Previous
• Next

HTML cơ bản

HTML các tiêu đềTiêu đề HTML được định nghĩa với để thẻ.Ví dụ:Đây là một tiêu đềĐây là một tiêu đềĐây là một tiêu đềHTML Paragraphs ( HTML khoản )Đoạn HTML được định nghĩa với .Đây là một đoạnĐây là…

Đọc thêm »

Share template tin tức chuẩn seo 2013

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilWDiBLy6UYLuysdeUsI8kCRWUuLsUH1ScGrsIrN_TzUwqmJbyF7a68LtRyab-41Elgd7-_SnTz338N44qS3aW3UVNwh_l792F-pY2a5Jaqr9Od8aEij1Dc_RMMWJFbd9sHyGrTaSDw_w/s1600/templates---vusteven.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="321" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilWDiBLy6UYLuysdeUsI8kCRWUuLsUH1ScGrsIrN_TzUwqmJbyF7a68LtRyab-41Elgd7-_SnTz338N44qS3aW3UVNwh_l792F-pY2a5Jaqr9Od8aEij1Dc_RMMWJFbd9sHyGrTaSDw_w/s640/templates---vusteven.png" width="640" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Demo<br /><br /><b><span style="color: blue; font-size: small;"><a href="http://thuthuat-vusteven.blogspot.com/">Demo online</a></span></b><br /><div style="text-align: left;"><br /></div></td></tr></tbody></table><b><a href="http://www.mediafire.com/download/k4kvdhu5d2dv077/template-vusteven%2520moi.xml">Download</a></b><br /><br />hôm nay mình share 1 <b><a href="http://www.vusteven.info/search/label/Web%20templates">template tin tức</a></b> đẹp chuẩn nhẹ và load rất nhanh,

Share template tin tức chuẩn seo 2013

DemoDemo onlineDownloadhôm nay mình share 1 template tin tức đẹp chuẩn nhẹ và load rất nhanh,…

Đọc thêm »

Share template chuẩn SEO 2013

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtLX6Zmu9qKq4LysT6xIZNx29AyxJhaTaOrXJtjqVavLhOwNnnW_k5VwtO6vsaxUpRLsvUswuj5D_s-TDJ87CKyQzZK6MoBnI7NU3309y9X8lqc886P7MJTg2lyZUVRcpgVY7R_HncfeI/s1600/share-template-seo-vusteven.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtLX6Zmu9qKq4LysT6xIZNx29AyxJhaTaOrXJtjqVavLhOwNnnW_k5VwtO6vsaxUpRLsvUswuj5D_s-TDJ87CKyQzZK6MoBnI7NU3309y9X8lqc886P7MJTg2lyZUVRcpgVY7R_HncfeI/s1600/share-template-seo-vusteven.png" /></a></div><div class="separator" style="clear: both; text-align: center;"><b><a href="http://www.vusteven.info/">Demo</a></b></div><div class="separator" style="clear: both; text-align: center;"><a href="http://vusteven-demo.blogspot.com/"><b>Demo online</b></a></div><div class="separator" style="clear: both; text-align: left;">Hôm nay mình <a href="http://www.vusteven.info/search/label/Templates%20blogger"><b>share template blogspot</b></a> chuẩn seo 2013,tích hợp nhiều tiện ích,<a href="http://www.vusteven.info/search/label/Templates%20blogger"><b>template</b></a> load nhanh,các chuyên mục dễ xem và tìm kiếm.nếu bạn thích <b><a href="http://www.vusteven.info/search/label/Templates%20blogger">template</a> </b>này thì comment để lại mail mình sẽ gởi cho bạn</div><div class="separator" style="clear: both; text-align: left;">Cám ơn các bạn ủng hộ !</div><br />

Share template chuẩn SEO 2013

DemoDemo onlineHôm nay mình share template blogspot chuẩn seo 2013,tích hợp nhiều tiện ích,template load nhanh,các chuyên mục dễ xem và tìm kiếm.nếu bạn thích template này thì comment để lại mail mình…

Đọc thêm »

Bài viết mới tự động trượt trên blogger

<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitL3hEc47XXBYaWFDO_lWBxJY0csZ28JfSOoAZjQ8HEPwfq_QqeodeM6Kz4EeNP_PnS_8bwIj-AGu2dO3BXBAgFOHe_g5Zauybi-_Pq-odMG4t3XvJ5JbMX3-EjBFS0vwfFOiRUSBaNig/s1600/demo-vusteven.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitL3hEc47XXBYaWFDO_lWBxJY0csZ28JfSOoAZjQ8HEPwfq_QqeodeM6Kz4EeNP_PnS_8bwIj-AGu2dO3BXBAgFOHe_g5Zauybi-_Pq-odMG4t3XvJ5JbMX3-EjBFS0vwfFOiRUSBaNig/s320/demo-vusteven.png" width="244" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Demo</td></tr></tbody></table><br />Chào bạn. Hôm nay <a href="http://www.vusteven.info/"><b>Vũ Steven</b></a> chia sẻ một<b><span style="color: blue;"> <a href="http://www.vusteven.info/">widget</a></span></b> mà có nhiều bạn yêu cầu.<br /><b>Widget</b> này hoàn toàn tự động trượt cho <b><a href="http://www.vusteven.info/">Blogger,</a></b>thanh trượt được bố trí rất đẹp và hấp dẫn và hơn hết có đầy đủ thông tin bài viết mới,như là hình ảnh,tiêu đề,thanh trượt này tự động cập nhật các bài viết mới<br /><br /><br /><br /><br /><b><a href="http://demo-vusteveninfo.blogspot.com/">Demo online</a></b><br /><br /><br /><br /><br /><br /><br /><br />+ Đăng nhập <b>Blogger</b> =><b> Bố cục</b> => Thêm  <b>HTML / JavaScript.</b><br /><b> - </b>thêm đoạn code sau vào<br /><br /><br /><b><br /></b><br /><pre><center><br /><div id="headerbox">Featured Posts</div><br /><div id="featuredpostside"></div><br /><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script><br /><script src="https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-sidebar-slider.js" type="text/javascript"></script><br /><script type='text/javascript'><br />//<![CDATA[<br />FeaturedPostSide({<br />blogURL:"<b><span style="color: red;">http://www.vusteven.info</span></b>",<br />MaxPost:<span style="color: red;"><b>3</b></span>,<br />idcontaint:"#featuredpostside",<br />ImageSize:300,<br />interval:5000,<br />autoplay:true,<br />tagName:false<br />});<br />//]]><br /></script><br /><link href='http://fonts.googleapis.com/css?family=Oswald:300' rel='stylesheet' type='text/css'/><br /><style scoped="" type="text/css"><br />/*<br />Made by AllBloggerTricks.com with lot of hardwork please keep the comment intact<br />*/<br />ul.abt-sidebar-slider * {<br /> -moz-box-sizing: border-box;<br />}<br />ul.abt-sidebar-slider {<br /> font: 11px Verdana,Geneva,sans-serif;<br />}<br />ul.abt-sidebar-slider, ul.abt-sidebar-slider li {<br /> list-style: none outside none;<br /> margin: 0;<br /> padding: 0;<br /> position: relative;<br />}<br />ul.abt-sidebar-slider {<br /> height: 500px;<br /> width: 100%;<br />}<br />ul.abt-sidebar-slider li {<br /> display: none;<br /> float: left;<br /> height: 24.5%;<br /> overflow: hidden;<br /> padding: 0;<br /> position: absolute;<br /> width: 100%;<br />}<br />ul.abt-sidebar-slider li:nth-child(1), ul.abt-sidebar-slider li:nth-child(2), ul.abt-sidebar-slider li:nth-child(3), ul.abt-sidebar-slider li:nth-child(4) {<br /> display: block;<br />}<br />ul.abt-sidebar-slider li:nth-child(2) {<br /> left: 0;<br /> top: 50%;<br />}<br />ul.abt-sidebar-slider img {<br /> border: 0 none;<br /> height: 100%;<br /> width: 100%;<br />}<br />ul.abt-sidebar-slider .overlayx, ul.abt-sidebar-slider li {<br /> transition: all 0.4s ease-in-out 0s;<br />}<br />ul.abt-sidebar-slider li:nth-child(4) {<br /> left: 0;<br /> top: 75%;<br /> width: 100%;<br />}<br />ul.abt-sidebar-slider li:nth-child(3) {<br /> left: 0;<br /> top: 25%;<br />}<br />ul.abt-sidebar-slider .overlayx {<br /> background-color: rgba(0, 0, 0, 0.5);<br /> height: 100%;<br /> left: 0;<br /> position: absolute;<br /> top: 0;<br /> width: 100%;<br /> z-index: 2;<br />}<br />ul.abt-sidebar-slider .overlayx, ul.abt-sidebar-slider img {<br /> border: 4px solid #2E8DCE;<br /> border-radius: 3px 3px 3px 3px;<br />}<br />ul.abt-sidebar-slider .overlayx:hover {<br /> opacity: 0.1;<br />}<br />ul.abt-sidebar-slider h4 {<br /> color: white;<br /> font-family: Oswald;<br /> font-size: 25px;<br /> font-weight: 100;<br /> line-height: 1.5em;<br /> margin: 0;<br /> padding: 0 10px;<br /> position: absolute;<br /> top: 25px;<br /> width: 100%;<br /> z-index: 2;<br />}<br />ul.abt-sidebar-slider .label_text {<br /> bottom: 10px;<br /> color: white;<br /> font-size: 90%;<br /> left: 10px;<br /> position: absolute;<br /> z-index: 2;<br />}<br />ul.abt-sidebar-slider li:nth-child(2) .autname, ul.abt-sidebar-slider li:nth-child(3) .autname {<br /> display: none;<br />}<br />.buttons {<br /> margin: 5px 0 0;<br />}<br />.buttons a {<br /> display: inline-block;<br /> height: 25px;<br /> position: relative;<br /> text-indent: -9999px;<br /> width: 15px;<br />}<br />.buttons a:before {<br /> border-color: transparent #535353 transparent transparent;<br /> border-style: solid;<br /> border-width: 8px 7px;<br /> content: "";<br /> height: 0;<br /> left: 50%;<br /> margin-left: -10px;<br /> margin-top: -8px;<br /> position: absolute;<br /> top: 50%;<br /> width: 0;<br />}<br />.buttons a.nextx:before {<br /> border-color: transparent transparent transparent #535353;<br /> margin-left: -3px;<br />}<br />.date {<br /> background: none repeat scroll 0 0 rgba(32, 122, 161, 0.84);<br /> bottom: 93px;<br /> padding: 8px;<br /> position: relative;<br /> right: 6px;<br />}<br />#headerbox {<br /> background: #8FB93D;<br /> font-family: Oswald;<br /> padding: 4px;<br />}<br /></style><br /></center><br /></pre><br />Lưu lại và xem kết quả nhen<br />MaxPost:<b style="color: red;">3: </b>là số bài muốn hiển thị <br /><span style="color: red; font-weight: bold;">Chú ý: </span>bạn thay <span style="font-family: monospace; white-space: pre;"><span style="color: red; font-weight: bold;">http://www.vusteven.info </span>thành link blog của bạn</span><br />Chúc bạn thành công

Bài viết mới tự động trượt trên blogger

DemoChào bạn. Hôm nay Vũ Steven chia sẻ một widget mà có nhiều bạn yêu cầu.Widget này hoàn toàn tự động trượt cho Blogger,thanh trượt được bố trí rất đẹp và hấp dẫn và hơn hết có đầy đủ thông tin bài …

Đọc thêm »

jQuery trượt hình ảnh cho Blogger

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHLVP4l7hiQhS-1YBtRCm_CvqSeo24gRB3KLa3Yu53Aob6Qj2iHFtMC_pnj0jRNhO5R7-h3-0qL1AlynavR1FwiYJCyBy9GNcgusFVcfx3g2WX48cR3OLgssAUrebR3JiI-HR6MLVkg_I/s1600/vusteven-demo.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHLVP4l7hiQhS-1YBtRCm_CvqSeo24gRB3KLa3Yu53Aob6Qj2iHFtMC_pnj0jRNhO5R7-h3-0qL1AlynavR1FwiYJCyBy9GNcgusFVcfx3g2WX48cR3OLgssAUrebR3JiI-HR6MLVkg_I/s1600/vusteven-demo.png" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;"><b>Demo:</b></td></tr></tbody></table>+ Đăng nhập <b><a href="http://www.vusteven.info/">Blogger</a></b> => Thiết kế => Chỉnh sửa HTML<br />  - Tìm <b></head></b><br />thêm đoạn code sau vào trước nó<br /><br /><pre><script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'/><br /><script type='text/javascript'><br />//<![CDATA[<br /><br />(function($){<br /> /* hoverIntent by Brian Cherne */<br /> $.fn.hoverIntent = function(f,g) {<br /> // default configuration options<br /> var cfg = {<br /> sensitivity: 7,<br /> interval: 100,<br /> timeout: 0<br /> };<br /> // override configuration options with user supplied object<br /> cfg = $.extend(cfg, g ? { over: f, out: g } : f );<br /><br /> // instantiate variables<br /> // cX, cY = current X and Y position of mouse, updated by mousemove event<br /> // pX, pY = previous X and Y position of mouse, set by mouseover and polling interval<br /> var cX, cY, pX, pY;<br /><br /> // A private function for getting mouse position<br /> var track = function(ev) {<br /> cX = ev.pageX;<br /> cY = ev.pageY;<br /> };<br /><br /> // A private function for comparing current and previous mouse position<br /> var compare = function(ev,ob) {<br /> ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t);<br /> // compare mouse positions to see if they've crossed the threshold<br /> if ( ( Math.abs(pX-cX) + Math.abs(pY-cY) ) < cfg.sensitivity ) {<br /> $(ob).unbind("mousemove",track);<br /> // set hoverIntent state to true (so mouseOut can be called)<br /> ob.hoverIntent_s = 1;<br /> return cfg.over.apply(ob,[ev]);<br /> } else {<br /> // set previous coordinates for next time<br /> pX = cX; pY = cY;<br /> // use self-calling timeout, guarantees intervals are spaced out properly (avoids JavaScript timer bugs)<br /> ob.hoverIntent_t = setTimeout( function(){compare(ev, ob);} , cfg.interval );<br /> }<br /> };<br /><br /> // A private function for delaying the mouseOut function<br /> var delay = function(ev,ob) {<br /> ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t);<br /> ob.hoverIntent_s = 0;<br /> return cfg.out.apply(ob,[ev]);<br /> };<br /><br /> // A private function for handling mouse 'hovering'<br /> var handleHover = function(e) {<br /> // next three lines copied from jQuery.hover, ignore children onMouseOver/onMouseOut<br /> var p = (e.type == "mouseover" ? e.fromElement : e.toElement) || e.relatedTarget;<br /> while ( p && p != this ) { try { p = p.parentNode; } catch(e) { p = this; } }<br /> if ( p == this ) { return false; }<br /><br /> // copy objects to be passed into t (required for event object to be passed in IE)<br /> var ev = jQuery.extend({},e);<br /> var ob = this;<br /><br /> // cancel hoverIntent timer if it exists<br /> if (ob.hoverIntent_t) { ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t); }<br /><br /> // else e.type == "onmouseover"<br /> if (e.type == "mouseover") {<br /> // set "previous" X and Y position based on initial entry point<br /> pX = ev.pageX; pY = ev.pageY;<br /> // update "current" X and Y position based on mousemove<br /> $(ob).bind("mousemove",track);<br /> // start polling interval (self-calling timeout) to compare mouse coordinates over time<br /> if (ob.hoverIntent_s != 1) { ob.hoverIntent_t = setTimeout( function(){compare(ev,ob);} , cfg.interval );}<br /><br /> // else e.type == "onmouseout"<br /> } else {<br /> // unbind expensive mousemove event<br /> $(ob).unbind("mousemove",track);<br /> // if hoverIntent state is true, then call the mouseOut function after the specified delay<br /> if (ob.hoverIntent_s == 1) { ob.hoverIntent_t = setTimeout( function(){delay(ev,ob);} , cfg.timeout );}<br /> }<br /> };<br /><br /> // bind the function to the two event listeners<br /> return this.mouseover(handleHover).mouseout(handleHover);<br /> };<br /> <br />})(jQuery);<br /><br />//]]><br /></script><br /><br /><script type='text/javascript'><br />//<![CDATA[<br /><br />/*<br /> * Superfish v1.4.8 - jQuery menu widget<br /> * Copyright (c) 2008 Joel Birch<br /> *<br /> * Dual licensed under the MIT and GPL licenses:<br /> * http://www.opensource.org/licenses/mit-license.php<br /> * http://www.gnu.org/licenses/gpl.html<br /> *<br /> * CHANGELOG: http://users.tpg.com.au/j_birch/plugins/superfish/changelog.txt<br /> */<br /><br />;(function($){<br /> $.fn.superfish = function(op){<br /><br /> var sf = $.fn.superfish,<br /> c = sf.c,<br /> $arrow = $(['<span class="',c.arrowClass,'"> »</span>'].join('')),<br /> over = function(){<br /> var $$ = $(this), menu = getMenu($$);<br /> clearTimeout(menu.sfTimer);<br /> $$.showSuperfishUl().siblings().hideSuperfishUl();<br /> },<br /> out = function(){<br /> var $$ = $(this), menu = getMenu($$), o = sf.op;<br /> clearTimeout(menu.sfTimer);<br /> menu.sfTimer=setTimeout(function(){<br /> o.retainPath=($.inArray($$[0],o.$path)>-1);<br /> $$.hideSuperfishUl();<br /> if (o.$path.length && $$.parents(['li.',o.hoverClass].join('')).length<1){over.call(o.$path);}<br /> },o.delay); <br /> },<br /> getMenu = function($menu){<br /> var menu = $menu.parents(['ul.',c.menuClass,':first'].join(''))[0];<br /> sf.op = sf.o[menu.serial];<br /> return menu;<br /> },<br /> addArrow = function($a){ $a.addClass(c.anchorClass).append($arrow.clone()); };<br /> <br /> return this.each(function() {<br /> var s = this.serial = sf.o.length;<br /> var o = $.extend({},sf.defaults,op);<br /> o.$path = $('li.'+o.pathClass,this).slice(0,o.pathLevels).each(function(){<br /> $(this).addClass([o.hoverClass,c.bcClass].join(' '))<br /> .filter('li:has(ul)').removeClass(o.pathClass);<br /> });<br /> sf.o[s] = sf.op = o;<br /> <br /> $('li:has(ul)',this)[($.fn.hoverIntent && !o.disableHI) ? 'hoverIntent' : 'hover'](over,out).each(function() {<br /> if (o.autoArrows) addArrow( $('>a:first-child',this) );<br /> })<br /> .not('.'+c.bcClass)<br /> .hideSuperfishUl();<br /> <br /> var $a = $('a',this);<br /> $a.each(function(i){<br /> var $li = $a.eq(i).parents('li');<br /> $a.eq(i).focus(function(){over.call($li);}).blur(function(){out.call($li);});<br /> });<br /> o.onInit.call(this);<br /> <br /> }).each(function() {<br /> var menuClasses = [c.menuClass];<br /> if (sf.op.dropShadows && !($.browser.msie && $.browser.version < 7)) menuClasses.push(c.shadowClass);<br /> $(this).addClass(menuClasses.join(' '));<br /> });<br /> };<br /><br /> var sf = $.fn.superfish;<br /> sf.o = [];<br /> sf.op = {};<br /> sf.IE7fix = function(){<br /> var o = sf.op;<br /> if ($.browser.msie && $.browser.version > 6 && o.dropShadows && o.animation.opacity!=undefined)<br /> this.toggleClass(sf.c.shadowClass+'-off');<br /> };<br /> sf.c = {<br /> bcClass : 'sf-breadcrumb',<br /> menuClass : 'sf-js-enabled',<br /> anchorClass : 'sf-with-ul',<br /> arrowClass : 'sf-sub-indicator',<br /> shadowClass : 'sf-shadow'<br /> };<br /> sf.defaults = {<br /> hoverClass : 'sfHover',<br /> pathClass : 'overideThisToUse',<br /> pathLevels : 1,<br /> delay : 800,<br /> animation : {opacity:'show'},<br /> speed : 'normal',<br /> autoArrows : true,<br /> dropShadows : true,<br /> disableHI : false, // true disables hoverIntent detection<br /> onInit : function(){}, // callback functions<br /> onBeforeShow: function(){},<br /> onShow : function(){},<br /> onHide : function(){}<br /> };<br /> $.fn.extend({<br /> hideSuperfishUl : function(){<br /> var o = sf.op,<br /> not = (o.retainPath===true) ? o.$path : '';<br /> o.retainPath = false;<br /> var $ul = $(['li.',o.hoverClass].join(''),this).add(this).not(not).removeClass(o.hoverClass)<br /> .find('>ul').hide().css('visibility','hidden');<br /> o.onHide.call($ul);<br /> return this;<br /> },<br /> showSuperfishUl : function(){<br /> var o = sf.op,<br /> sh = sf.c.shadowClass+'-off',<br /> $ul = this.addClass(o.hoverClass)<br /> .find('>ul:hidden').css('visibility','visible');<br /> sf.IE7fix.call($ul);<br /> o.onBeforeShow.call($ul);<br /> $ul.animate(o.animation,o.speed,function(){ sf.IE7fix.call($ul); o.onShow.call($ul); });<br /> return this;<br /> }<br /> });<br /><br />})(jQuery);<br /><br /><br /><br />//]]><br /></script><br /><br /><br /><script type='text/javascript'><br />//<![CDATA[<br /><br />/*<br /> * jQuery Cycle Plugin (with Transition Definitions)<br /> * Examples and documentation at: http://jquery.malsup.com/cycle/<br /> * Copyright (c) 2007-2010 M. Alsup<br /> * Version: 2.88 (08-JUN-2010)<br /> * Dual licensed under the MIT and GPL licenses.<br /> * http://jquery.malsup.com/license.html<br /> * Requires: jQuery v1.2.6 or later<br /> */<br />(function($){var ver="2.88";if($.support==undefined){$.support={opacity:!($.browser.msie)};}function debug(s){if($.fn.cycle.debug){log(s);}}function log(){if(window.console&&window.console.log){window.console.log("[cycle] "+Array.prototype.join.call(arguments," "));}}$.fn.cycle=function(options,arg2){var o={s:this.selector,c:this.context};if(this.length===0&&options!="stop"){if(!$.isReady&&o.s){log("DOM not ready, queuing slideshow");$(function(){$(o.s,o.c).cycle(options,arg2);});return this;}log("terminating; zero elements found by selector"+($.isReady?"":" (DOM not ready)"));return this;}return this.each(function(){var opts=handleArguments(this,options,arg2);if(opts===false){return;}opts.updateActivePagerLink=opts.updateActivePagerLink||$.fn.cycle.updateActivePagerLink;if(this.cycleTimeout){clearTimeout(this.cycleTimeout);}this.cycleTimeout=this.cyclePause=0;var $cont=$(this);var $slides=opts.slideExpr?$(opts.slideExpr,this):$cont.children();var els=$slides.get();if(els.length<2){log("terminating; too few slides: "+els.length);return;}var opts2=buildOptions($cont,$slides,els,opts,o);if(opts2===false){return;}var startTime=opts2.continuous?10:getTimeout(els[opts2.currSlide],els[opts2.nextSlide],opts2,!opts2.rev);if(startTime){startTime+=(opts2.delay||0);if(startTime<10){startTime=10;}debug("first timeout: "+startTime);this.cycleTimeout=setTimeout(function(){go(els,opts2,0,(!opts2.rev&&!opts.backwards));},startTime);}});};function handleArguments(cont,options,arg2){if(cont.cycleStop==undefined){cont.cycleStop=0;}if(options===undefined||options===null){options={};}if(options.constructor==String){switch(options){case"destroy":case"stop":var opts=$(cont).data("cycle.opts");if(!opts){return false;}cont.cycleStop++;if(cont.cycleTimeout){clearTimeout(cont.cycleTimeout);}cont.cycleTimeout=0;$(cont).removeData("cycle.opts");if(options=="destroy"){destroy(opts);}return false;case"toggle":cont.cyclePause=(cont.cyclePause===1)?0:1;checkInstantResume(cont.cyclePause,arg2,cont);return false;case"pause":cont.cyclePause=1;return false;case"resume":cont.cyclePause=0;checkInstantResume(false,arg2,cont);return false;case"prev":case"next":var opts=$(cont).data("cycle.opts");if(!opts){log('options not found, "prev/next" ignored');return false;}$.fn.cycle[options](opts);return false;default:options={fx:options};}return options;}else{if(options.constructor==Number){var num=options;options=$(cont).data("cycle.opts");if(!options){log("options not found, can not advance slide");return false;}if(num<0||num>=options.elements.length){log("invalid slide index: "+num);return false;}options.nextSlide=num;if(cont.cycleTimeout){clearTimeout(cont.cycleTimeout);cont.cycleTimeout=0;}if(typeof arg2=="string"){options.oneTimeFx=arg2;}go(options.elements,options,1,num>=options.currSlide);return false;}}return options;function checkInstantResume(isPaused,arg2,cont){if(!isPaused&&arg2===true){var options=$(cont).data("cycle.opts");if(!options){log("options not found, can not resume");return false;}if(cont.cycleTimeout){clearTimeout(cont.cycleTimeout);cont.cycleTimeout=0;}go(options.elements,options,1,(!opts.rev&&!opts.backwards));}}}function removeFilter(el,opts){if(!$.support.opacity&&opts.cleartype&&el.style.filter){try{el.style.removeAttribute("filter");}catch(smother){}}}function destroy(opts){if(opts.next){$(opts.next).unbind(opts.prevNextEvent);}if(opts.prev){$(opts.prev).unbind(opts.prevNextEvent);}if(opts.pager||opts.pagerAnchorBuilder){$.each(opts.pagerAnchors||[],function(){this.unbind().remove();});}opts.pagerAnchors=null;if(opts.destroy){opts.destroy(opts);}}function buildOptions($cont,$slides,els,options,o){var opts=$.extend({},$.fn.cycle.defaults,options||{},$.metadata?$cont.metadata():$.meta?$cont.data():{});if(opts.autostop){opts.countdown=opts.autostopCount||els.length;}var cont=$cont[0];$cont.data("cycle.opts",opts);opts.$cont=$cont;opts.stopCount=cont.cycleStop;opts.elements=els;opts.before=opts.before?[opts.before]:[];opts.after=opts.after?[opts.after]:[];opts.after.unshift(function(){opts.busy=0;});if(!$.support.opacity&&opts.cleartype){opts.after.push(function(){removeFilter(this,opts);});}if(opts.continuous){opts.after.push(function(){go(els,opts,0,(!opts.rev&&!opts.backwards));});}saveOriginalOpts(opts);if(!$.support.opacity&&opts.cleartype&&!opts.cleartypeNoBg){clearTypeFix($slides);}if($cont.css("position")=="static"){$cont.css("position","relative");}if(opts.width){$cont.width(opts.width);}if(opts.height&&opts.height!="auto"){$cont.height(opts.height);}if(opts.startingSlide){opts.startingSlide=parseInt(opts.startingSlide);}else{if(opts.backwards){opts.startingSlide=els.length-1;}}if(opts.random){opts.randomMap=[];for(var i=0;i<els.length;i++){opts.randomMap.push(i);}opts.randomMap.sort(function(a,b){return Math.random()-0.5;});opts.randomIndex=1;opts.startingSlide=opts.randomMap[1];}else{if(opts.startingSlide>=els.length){opts.startingSlide=0;}}opts.currSlide=opts.startingSlide||0;var first=opts.startingSlide;$slides.css({position:"absolute",top:0,left:0}).hide().each(function(i){var z;if(opts.backwards){z=first?i<=first?els.length+(i-first):first-i:els.length-i;}else{z=first?i>=first?els.length-(i-first):first-i:els.length-i;}$(this).css("z-index",z);});$(els[first]).css("opacity",1).show();removeFilter(els[first],opts);if(opts.fit&&opts.width){$slides.width(opts.width);}if(opts.fit&&opts.height&&opts.height!="auto"){$slides.height(opts.height);}var reshape=opts.containerResize&&!$cont.innerHeight();if(reshape){var maxw=0,maxh=0;for(var j=0;j<els.length;j++){var $e=$(els[j]),e=$e[0],w=$e.outerWidth(),h=$e.outerHeight();if(!w){w=e.offsetWidth||e.width||$e.attr("width");}if(!h){h=e.offsetHeight||e.height||$e.attr("height");}maxw=w>maxw?w:maxw;maxh=h>maxh?h:maxh;}if(maxw>0&&maxh>0){$cont.css({width:maxw+"px",height:maxh+"px"});}}if(opts.pause){$cont.hover(function(){this.cyclePause++;},function(){this.cyclePause--;});}if(supportMultiTransitions(opts)===false){return false;}var requeue=false;options.requeueAttempts=options.requeueAttempts||0;$slides.each(function(){var $el=$(this);this.cycleH=(opts.fit&&opts.height)?opts.height:($el.height()||this.offsetHeight||this.height||$el.attr("height")||0);this.cycleW=(opts.fit&&opts.width)?opts.width:($el.width()||this.offsetWidth||this.width||$el.attr("width")||0);if($el.is("img")){var loadingIE=($.browser.msie&&this.cycleW==28&&this.cycleH==30&&!this.complete);var loadingFF=($.browser.mozilla&&this.cycleW==34&&this.cycleH==19&&!this.complete);var loadingOp=($.browser.opera&&((this.cycleW==42&&this.cycleH==19)||(this.cycleW==37&&this.cycleH==17))&&!this.complete);var loadingOther=(this.cycleH==0&&this.cycleW==0&&!this.complete);if(loadingIE||loadingFF||loadingOp||loadingOther){if(o.s&&opts.requeueOnImageNotLoaded&&++options.requeueAttempts<100){log(options.requeueAttempts," - img slide not loaded, requeuing slideshow: ",this.src,this.cycleW,this.cycleH);setTimeout(function(){$(o.s,o.c).cycle(options);},opts.requeueTimeout);requeue=true;return false;}else{log("could not determine size of image: "+this.src,this.cycleW,this.cycleH);}}}return true;});if(requeue){return false;}opts.cssBefore=opts.cssBefore||{};opts.animIn=opts.animIn||{};opts.animOut=opts.animOut||{};$slides.not(":eq("+first+")").css(opts.cssBefore);if(opts.cssFirst){$($slides[first]).css(opts.cssFirst);}if(opts.timeout){opts.timeout=parseInt(opts.timeout);if(opts.speed.constructor==String){opts.speed=$.fx.speeds[opts.speed]||parseInt(opts.speed);}if(!opts.sync){opts.speed=opts.speed/2;}var buffer=opts.fx=="shuffle"?500:250;while((opts.timeout-opts.speed)<buffer){opts.timeout+=opts.speed;}}if(opts.easing){opts.easeIn=opts.easeOut=opts.easing;}if(!opts.speedIn){opts.speedIn=opts.speed;}if(!opts.speedOut){opts.speedOut=opts.speed;}opts.slideCount=els.length;opts.currSlide=opts.lastSlide=first;if(opts.random){if(++opts.randomIndex==els.length){opts.randomIndex=0;}opts.nextSlide=opts.randomMap[opts.randomIndex];}else{if(opts.backwards){opts.nextSlide=opts.startingSlide==0?(els.length-1):opts.startingSlide-1;}else{opts.nextSlide=opts.startingSlide>=(els.length-1)?0:opts.startingSlide+1;}}if(!opts.multiFx){var init=$.fn.cycle.transitions[opts.fx];if($.isFunction(init)){init($cont,$slides,opts);}else{if(opts.fx!="custom"&&!opts.multiFx){log("unknown transition: "+opts.fx,"; slideshow terminating");return false;}}}var e0=$slides[first];if(opts.before.length){opts.before[0].apply(e0,[e0,e0,opts,true]);}if(opts.after.length>1){opts.after[1].apply(e0,[e0,e0,opts,true]);}if(opts.next){$(opts.next).bind(opts.prevNextEvent,function(){return advance(opts,opts.rev?-1:1);});}if(opts.prev){$(opts.prev).bind(opts.prevNextEvent,function(){return advance(opts,opts.rev?1:-1);});}if(opts.pager||opts.pagerAnchorBuilder){buildPager(els,opts);}exposeAddSlide(opts,els);return opts;}function saveOriginalOpts(opts){opts.original={before:[],after:[]};opts.original.cssBefore=$.extend({},opts.cssBefore);opts.original.cssAfter=$.extend({},opts.cssAfter);opts.original.animIn=$.extend({},opts.animIn);opts.original.animOut=$.extend({},opts.animOut);$.each(opts.before,function(){opts.original.before.push(this);});$.each(opts.after,function(){opts.original.after.push(this);});}function supportMultiTransitions(opts){var i,tx,txs=$.fn.cycle.transitions;if(opts.fx.indexOf(",")>0){opts.multiFx=true;opts.fxs=opts.fx.replace(/\s*/g,"").split(",");for(i=0;i<opts.fxs.length;i++){var fx=opts.fxs[i];tx=txs[fx];if(!tx||!txs.hasOwnProperty(fx)||!$.isFunction(tx)){log("discarding unknown transition: ",fx);opts.fxs.splice(i,1);i--;}}if(!opts.fxs.length){log("No valid transitions named; slideshow terminating.");return false;}}else{if(opts.fx=="all"){opts.multiFx=true;opts.fxs=[];for(p in txs){tx=txs[p];if(txs.hasOwnProperty(p)&&$.isFunction(tx)){opts.fxs.push(p);}}}}if(opts.multiFx&&opts.randomizeEffects){var r1=Math.floor(Math.random()*20)+30;for(i=0;i<r1;i++){var r2=Math.floor(Math.random()*opts.fxs.length);opts.fxs.push(opts.fxs.splice(r2,1)[0]);}debug("randomized fx sequence: ",opts.fxs);}return true;}function exposeAddSlide(opts,els){opts.addSlide=function(newSlide,prepend){var $s=$(newSlide),s=$s[0];if(!opts.autostopCount){opts.countdown++;}els[prepend?"unshift":"push"](s);if(opts.els){opts.els[prepend?"unshift":"push"](s);}opts.slideCount=els.length;$s.css("position","absolute");$s[prepend?"prependTo":"appendTo"](opts.$cont);if(prepend){opts.currSlide++;opts.nextSlide++;}if(!$.support.opacity&&opts.cleartype&&!opts.cleartypeNoBg){clearTypeFix($s);}if(opts.fit&&opts.width){$s.width(opts.width);}if(opts.fit&&opts.height&&opts.height!="auto"){$slides.height(opts.height);}s.cycleH=(opts.fit&&opts.height)?opts.height:$s.height();s.cycleW=(opts.fit&&opts.width)?opts.width:$s.width();$s.css(opts.cssBefore);if(opts.pager||opts.pagerAnchorBuilder){$.fn.cycle.createPagerAnchor(els.length-1,s,$(opts.pager),els,opts);}if($.isFunction(opts.onAddSlide)){opts.onAddSlide($s);}else{$s.hide();}};}$.fn.cycle.resetState=function(opts,fx){fx=fx||opts.fx;opts.before=[];opts.after=[];opts.cssBefore=$.extend({},opts.original.cssBefore);opts.cssAfter=$.extend({},opts.original.cssAfter);opts.animIn=$.extend({},opts.original.animIn);opts.animOut=$.extend({},opts.original.animOut);opts.fxFn=null;$.each(opts.original.before,function(){opts.before.push(this);});$.each(opts.original.after,function(){opts.after.push(this);});var init=$.fn.cycle.transitions[fx];if($.isFunction(init)){init(opts.$cont,$(opts.elements),opts);}};function go(els,opts,manual,fwd){if(manual&&opts.busy&&opts.manualTrump){debug("manualTrump in go(), stopping active transition");$(els).stop(true,true);opts.busy=false;}if(opts.busy){debug("transition active, ignoring new tx request");return;}var p=opts.$cont[0],curr=els[opts.currSlide],next=els[opts.nextSlide];if(p.cycleStop!=opts.stopCount||p.cycleTimeout===0&&!manual){return;}if(!manual&&!p.cyclePause&&!opts.bounce&&((opts.autostop&&(--opts.countdown<=0))||(opts.nowrap&&!opts.random&&opts.nextSlide<opts.currSlide))){if(opts.end){opts.end(opts);}return;}var changed=false;if((manual||!p.cyclePause)&&(opts.nextSlide!=opts.currSlide)){changed=true;var fx=opts.fx;curr.cycleH=curr.cycleH||$(curr).height();curr.cycleW=curr.cycleW||$(curr).width();next.cycleH=next.cycleH||$(next).height();next.cycleW=next.cycleW||$(next).width();if(opts.multiFx){if(opts.lastFx==undefined||++opts.lastFx>=opts.fxs.length){opts.lastFx=0;}fx=opts.fxs[opts.lastFx];opts.currFx=fx;}if(opts.oneTimeFx){fx=opts.oneTimeFx;opts.oneTimeFx=null;}$.fn.cycle.resetState(opts,fx);if(opts.before.length){$.each(opts.before,function(i,o){if(p.cycleStop!=opts.stopCount){return;}o.apply(next,[curr,next,opts,fwd]);});}var after=function(){$.each(opts.after,function(i,o){if(p.cycleStop!=opts.stopCount){return;}o.apply(next,[curr,next,opts,fwd]);});};debug("tx firing; currSlide: "+opts.currSlide+"; nextSlide: "+opts.nextSlide);opts.busy=1;if(opts.fxFn){opts.fxFn(curr,next,opts,after,fwd,manual&&opts.fastOnEvent);}else{if($.isFunction($.fn.cycle[opts.fx])){$.fn.cycle[opts.fx](curr,next,opts,after,fwd,manual&&opts.fastOnEvent);}else{$.fn.cycle.custom(curr,next,opts,after,fwd,manual&&opts.fastOnEvent);}}}if(changed||opts.nextSlide==opts.currSlide){opts.lastSlide=opts.currSlide;if(opts.random){opts.currSlide=opts.nextSlide;if(++opts.randomIndex==els.length){opts.randomIndex=0;}opts.nextSlide=opts.randomMap[opts.randomIndex];if(opts.nextSlide==opts.currSlide){opts.nextSlide=(opts.currSlide==opts.slideCount-1)?0:opts.currSlide+1;}}else{if(opts.backwards){var roll=(opts.nextSlide-1)<0;if(roll&&opts.bounce){opts.backwards=!opts.backwards;opts.nextSlide=1;opts.currSlide=0;}else{opts.nextSlide=roll?(els.length-1):opts.nextSlide-1;opts.currSlide=roll?0:opts.nextSlide+1;}}else{var roll=(opts.nextSlide+1)==els.length;if(roll&&opts.bounce){opts.backwards=!opts.backwards;opts.nextSlide=els.length-2;opts.currSlide=els.length-1;}else{opts.nextSlide=roll?0:opts.nextSlide+1;opts.currSlide=roll?els.length-1:opts.nextSlide-1;}}}}if(changed&&opts.pager){opts.updateActivePagerLink(opts.pager,opts.currSlide,opts.activePagerClass);}var ms=0;if(opts.timeout&&!opts.continuous){ms=getTimeout(els[opts.currSlide],els[opts.nextSlide],opts,fwd);}else{if(opts.continuous&&p.cyclePause){ms=10;}}if(ms>0){p.cycleTimeout=setTimeout(function(){go(els,opts,0,(!opts.rev&&!opts.backwards));},ms);}}$.fn.cycle.updateActivePagerLink=function(pager,currSlide,clsName){$(pager).each(function(){$(this).children().removeClass(clsName).eq(currSlide).addClass(clsName);});};function getTimeout(curr,next,opts,fwd){if(opts.timeoutFn){var t=opts.timeoutFn.call(curr,curr,next,opts,fwd);while((t-opts.speed)<250){t+=opts.speed;}debug("calculated timeout: "+t+"; speed: "+opts.speed);if(t!==false){return t;}}return opts.timeout;}$.fn.cycle.next=function(opts){advance(opts,opts.rev?-1:1);};$.fn.cycle.prev=function(opts){advance(opts,opts.rev?1:-1);};function advance(opts,val){var els=opts.elements;var p=opts.$cont[0],timeout=p.cycleTimeout;if(timeout){clearTimeout(timeout);p.cycleTimeout=0;}if(opts.random&&val<0){opts.randomIndex--;if(--opts.randomIndex==-2){opts.randomIndex=els.length-2;}else{if(opts.randomIndex==-1){opts.randomIndex=els.length-1;}}opts.nextSlide=opts.randomMap[opts.randomIndex];}else{if(opts.random){opts.nextSlide=opts.randomMap[opts.randomIndex];}else{opts.nextSlide=opts.currSlide+val;if(opts.nextSlide<0){if(opts.nowrap){return false;}opts.nextSlide=els.length-1;}else{if(opts.nextSlide>=els.length){if(opts.nowrap){return false;}opts.nextSlide=0;}}}}var cb=opts.onPrevNextEvent||opts.prevNextClick;if($.isFunction(cb)){cb(val>0,opts.nextSlide,els[opts.nextSlide]);}go(els,opts,1,val>=0);return false;}function buildPager(els,opts){var $p=$(opts.pager);$.each(els,function(i,o){$.fn.cycle.createPagerAnchor(i,o,$p,els,opts);});opts.updateActivePagerLink(opts.pager,opts.startingSlide,opts.activePagerClass);}$.fn.cycle.createPagerAnchor=function(i,el,$p,els,opts){var a;if($.isFunction(opts.pagerAnchorBuilder)){a=opts.pagerAnchorBuilder(i,el);debug("pagerAnchorBuilder("+i+", el) returned: "+a);}else{a='<a href="#">'+(i+1)+"</a>";}if(!a){return;}var $a=$(a);if($a.parents("body").length===0){var arr=[];if($p.length>1){$p.each(function(){var $clone=$a.clone(true);$(this).append($clone);arr.push($clone[0]);});$a=$(arr);}else{$a.appendTo($p);}}opts.pagerAnchors=opts.pagerAnchors||[];opts.pagerAnchors.push($a);$a.bind(opts.pagerEvent,function(e){e.preventDefault();opts.nextSlide=i;var p=opts.$cont[0],timeout=p.cycleTimeout;if(timeout){clearTimeout(timeout);p.cycleTimeout=0;}var cb=opts.onPagerEvent||opts.pagerClick;if($.isFunction(cb)){cb(opts.nextSlide,els[opts.nextSlide]);}go(els,opts,1,opts.currSlide<i);});if(!/^click/.test(opts.pagerEvent)&&!opts.allowPagerClickBubble){$a.bind("click.cycle",function(){return false;});}if(opts.pauseOnPagerHover){$a.hover(function(){opts.$cont[0].cyclePause++;},function(){opts.$cont[0].cyclePause--;});}};$.fn.cycle.hopsFromLast=function(opts,fwd){var hops,l=opts.lastSlide,c=opts.currSlide;if(fwd){hops=c>l?c-l:opts.slideCount-l;}else{hops=c<l?l-c:l+opts.slideCount-c;}return hops;};function clearTypeFix($slides){debug("applying clearType background-color hack");function hex(s){s=parseInt(s).toString(16);return s.length<2?"0"+s:s;}function getBg(e){for(;e&&e.nodeName.toLowerCase()!="html";e=e.parentNode){var v=$.css(e,"background-color");if(v.indexOf("rgb")>=0){var rgb=v.match(/\d+/g);return"#"+hex(rgb[0])+hex(rgb[1])+hex(rgb[2]);}if(v&&v!="transparent"){return v;}}return"#ffffff";}$slides.each(function(){$(this).css("background-color",getBg(this));});}$.fn.cycle.commonReset=function(curr,next,opts,w,h,rev){$(opts.elements).not(curr).hide();opts.cssBefore.opacity=1;opts.cssBefore.display="block";if(w!==false&&next.cycleW>0){opts.cssBefore.width=next.cycleW;}if(h!==false&&next.cycleH>0){opts.cssBefore.height=next.cycleH;}opts.cssAfter=opts.cssAfter||{};opts.cssAfter.display="none";$(curr).css("zIndex",opts.slideCount+(rev===true?1:0));$(next).css("zIndex",opts.slideCount+(rev===true?0:1));};$.fn.cycle.custom=function(curr,next,opts,cb,fwd,speedOverride){var $l=$(curr),$n=$(next);var speedIn=opts.speedIn,speedOut=opts.speedOut,easeIn=opts.easeIn,easeOut=opts.easeOut;$n.css(opts.cssBefore);if(speedOverride){if(typeof speedOverride=="number"){speedIn=speedOut=speedOverride;}else{speedIn=speedOut=1;}easeIn=easeOut=null;}var fn=function(){$n.animate(opts.animIn,speedIn,easeIn,cb);};$l.animate(opts.animOut,speedOut,easeOut,function(){if(opts.cssAfter){$l.css(opts.cssAfter);}if(!opts.sync){fn();}});if(opts.sync){fn();}};$.fn.cycle.transitions={fade:function($cont,$slides,opts){$slides.not(":eq("+opts.currSlide+")").css("opacity",0);opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts);opts.cssBefore.opacity=0;});opts.animIn={opacity:1};opts.animOut={opacity:0};opts.cssBefore={top:0,left:0};}};$.fn.cycle.ver=function(){return ver;};$.fn.cycle.defaults={fx:"fade",timeout:4000,timeoutFn:null,continuous:0,speed:1000,speedIn:null,speedOut:null,next:null,prev:null,onPrevNextEvent:null,prevNextEvent:"click.cycle",pager:null,onPagerEvent:null,pagerEvent:"click.cycle",allowPagerClickBubble:false,pagerAnchorBuilder:null,before:null,after:null,end:null,easing:null,easeIn:null,easeOut:null,shuffle:null,animIn:null,animOut:null,cssBefore:null,cssAfter:null,fxFn:null,height:"auto",startingSlide:0,sync:1,random:0,fit:0,containerResize:1,pause:0,pauseOnPagerHover:0,autostop:0,autostopCount:0,delay:0,slideExpr:null,cleartype:!$.support.opacity,cleartypeNoBg:false,nowrap:0,fastOnEvent:0,randomizeEffects:1,rev:0,manualTrump:true,requeueOnImageNotLoaded:true,requeueTimeout:250,activePagerClass:"activeSlide",updateActivePagerLink:null,backwards:false};})(jQuery);<br />/*<br /> * jQuery Cycle Plugin Transition Definitions<br /> * This script is a plugin for the jQuery Cycle Plugin<br /> * Examples and documentation at: http://malsup.com/jquery/cycle/<br /> * Copyright (c) 2007-2010 M. Alsup<br /> * Version: 2.72<br /> * Dual licensed under the MIT and GPL licenses:<br /> * http://www.opensource.org/licenses/mit-license.php<br /> * http://www.gnu.org/licenses/gpl.html<br /> */<br />(function($){$.fn.cycle.transitions.none=function($cont,$slides,opts){opts.fxFn=function(curr,next,opts,after){$(next).show();$(curr).hide();after();};};$.fn.cycle.transitions.scrollUp=function($cont,$slides,opts){$cont.css("overflow","hidden");opts.before.push($.fn.cycle.commonReset);var h=$cont.height();opts.cssBefore={top:h,left:0};opts.cssFirst={top:0};opts.animIn={top:0};opts.animOut={top:-h};};$.fn.cycle.transitions.scrollDown=function($cont,$slides,opts){$cont.css("overflow","hidden");opts.before.push($.fn.cycle.commonReset);var h=$cont.height();opts.cssFirst={top:0};opts.cssBefore={top:-h,left:0};opts.animIn={top:0};opts.animOut={top:h};};$.fn.cycle.transitions.scrollLeft=function($cont,$slides,opts){$cont.css("overflow","hidden");opts.before.push($.fn.cycle.commonReset);var w=$cont.width();opts.cssFirst={left:0};opts.cssBefore={left:w,top:0};opts.animIn={left:0};opts.animOut={left:0-w};};$.fn.cycle.transitions.scrollRight=function($cont,$slides,opts){$cont.css("overflow","hidden");opts.before.push($.fn.cycle.commonReset);var w=$cont.width();opts.cssFirst={left:0};opts.cssBefore={left:-w,top:0};opts.animIn={left:0};opts.animOut={left:w};};$.fn.cycle.transitions.scrollHorz=function($cont,$slides,opts){$cont.css("overflow","hidden").width();opts.before.push(function(curr,next,opts,fwd){$.fn.cycle.commonReset(curr,next,opts);opts.cssBefore.left=fwd?(next.cycleW-1):(1-next.cycleW);opts.animOut.left=fwd?-curr.cycleW:curr.cycleW;});opts.cssFirst={left:0};opts.cssBefore={top:0};opts.animIn={left:0};opts.animOut={top:0};};$.fn.cycle.transitions.scrollVert=function($cont,$slides,opts){$cont.css("overflow","hidden");opts.before.push(function(curr,next,opts,fwd){$.fn.cycle.commonReset(curr,next,opts);opts.cssBefore.top=fwd?(1-next.cycleH):(next.cycleH-1);opts.animOut.top=fwd?curr.cycleH:-curr.cycleH;});opts.cssFirst={top:0};opts.cssBefore={left:0};opts.animIn={top:0};opts.animOut={left:0};};$.fn.cycle.transitions.slideX=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$(opts.elements).not(curr).hide();$.fn.cycle.commonReset(curr,next,opts,false,true);opts.animIn.width=next.cycleW;});opts.cssBefore={left:0,top:0,width:0};opts.animIn={width:"show"};opts.animOut={width:0};};$.fn.cycle.transitions.slideY=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$(opts.elements).not(curr).hide();$.fn.cycle.commonReset(curr,next,opts,true,false);opts.animIn.height=next.cycleH;});opts.cssBefore={left:0,top:0,height:0};opts.animIn={height:"show"};opts.animOut={height:0};};$.fn.cycle.transitions.shuffle=function($cont,$slides,opts){var i,w=$cont.css("overflow","visible").width();$slides.css({left:0,top:0});opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,true,true);});if(!opts.speedAdjusted){opts.speed=opts.speed/2;opts.speedAdjusted=true;}opts.random=0;opts.shuffle=opts.shuffle||{left:-w,top:15};opts.els=[];for(i=0;i<$slides.length;i++){opts.els.push($slides[i]);}for(i=0;i<opts.currSlide;i++){opts.els.push(opts.els.shift());}opts.fxFn=function(curr,next,opts,cb,fwd){var $el=fwd?$(curr):$(next);$(next).css(opts.cssBefore);var count=opts.slideCount;$el.animate(opts.shuffle,opts.speedIn,opts.easeIn,function(){var hops=$.fn.cycle.hopsFromLast(opts,fwd);for(var k=0;k<hops;k++){fwd?opts.els.push(opts.els.shift()):opts.els.unshift(opts.els.pop());}if(fwd){for(var i=0,len=opts.els.length;i<len;i++){$(opts.els[i]).css("z-index",len-i+count);}}else{var z=$(curr).css("z-index");$el.css("z-index",parseInt(z)+1+count);}$el.animate({left:0,top:0},opts.speedOut,opts.easeOut,function(){$(fwd?this:curr).hide();if(cb){cb();}});});};opts.cssBefore={display:"block",opacity:1,top:0,left:0};};$.fn.cycle.transitions.turnUp=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,false);opts.cssBefore.top=next.cycleH;opts.animIn.height=next.cycleH;});opts.cssFirst={top:0};opts.cssBefore={left:0,height:0};opts.animIn={top:0};opts.animOut={height:0};};$.fn.cycle.transitions.turnDown=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,false);opts.animIn.height=next.cycleH;opts.animOut.top=curr.cycleH;});opts.cssFirst={top:0};opts.cssBefore={left:0,top:0,height:0};opts.animOut={height:0};};$.fn.cycle.transitions.turnLeft=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,false,true);opts.cssBefore.left=next.cycleW;opts.animIn.width=next.cycleW;});opts.cssBefore={top:0,width:0};opts.animIn={left:0};opts.animOut={width:0};};$.fn.cycle.transitions.turnRight=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,false,true);opts.animIn.width=next.cycleW;opts.animOut.left=curr.cycleW;});opts.cssBefore={top:0,left:0,width:0};opts.animIn={left:0};opts.animOut={width:0};};$.fn.cycle.transitions.zoom=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,false,false,true);opts.cssBefore.top=next.cycleH/2;opts.cssBefore.left=next.cycleW/2;opts.animIn={top:0,left:0,width:next.cycleW,height:next.cycleH};opts.animOut={width:0,height:0,top:curr.cycleH/2,left:curr.cycleW/2};});opts.cssFirst={top:0,left:0};opts.cssBefore={width:0,height:0};};$.fn.cycle.transitions.fadeZoom=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,false,false);opts.cssBefore.left=next.cycleW/2;opts.cssBefore.top=next.cycleH/2;opts.animIn={top:0,left:0,width:next.cycleW,height:next.cycleH};});opts.cssBefore={width:0,height:0};opts.animOut={opacity:0};};$.fn.cycle.transitions.blindX=function($cont,$slides,opts){var w=$cont.css("overflow","hidden").width();opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts);opts.animIn.width=next.cycleW;opts.animOut.left=curr.cycleW;});opts.cssBefore={left:w,top:0};opts.animIn={left:0};opts.animOut={left:w};};$.fn.cycle.transitions.blindY=function($cont,$slides,opts){var h=$cont.css("overflow","hidden").height();opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts);opts.animIn.height=next.cycleH;opts.animOut.top=curr.cycleH;});opts.cssBefore={top:h,left:0};opts.animIn={top:0};opts.animOut={top:h};};$.fn.cycle.transitions.blindZ=function($cont,$slides,opts){var h=$cont.css("overflow","hidden").height();var w=$cont.width();opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts);opts.animIn.height=next.cycleH;opts.animOut.top=curr.cycleH;});opts.cssBefore={top:h,left:w};opts.animIn={top:0,left:0};opts.animOut={top:h,left:w};};$.fn.cycle.transitions.growX=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,false,true);opts.cssBefore.left=this.cycleW/2;opts.animIn={left:0,width:this.cycleW};opts.animOut={left:0};});opts.cssBefore={width:0,top:0};};$.fn.cycle.transitions.growY=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,false);opts.cssBefore.top=this.cycleH/2;opts.animIn={top:0,height:this.cycleH};opts.animOut={top:0};});opts.cssBefore={height:0,left:0};};$.fn.cycle.transitions.curtainX=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,false,true,true);opts.cssBefore.left=next.cycleW/2;opts.animIn={left:0,width:this.cycleW};opts.animOut={left:curr.cycleW/2,width:0};});opts.cssBefore={top:0,width:0};};$.fn.cycle.transitions.curtainY=function($cont,$slides,opts){opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,false,true);opts.cssBefore.top=next.cycleH/2;opts.animIn={top:0,height:next.cycleH};opts.animOut={top:curr.cycleH/2,height:0};});opts.cssBefore={left:0,height:0};};$.fn.cycle.transitions.cover=function($cont,$slides,opts){var d=opts.direction||"left";var w=$cont.css("overflow","hidden").width();var h=$cont.height();opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts);if(d=="right"){opts.cssBefore.left=-w;}else{if(d=="up"){opts.cssBefore.top=h;}else{if(d=="down"){opts.cssBefore.top=-h;}else{opts.cssBefore.left=w;}}}});opts.animIn={left:0,top:0};opts.animOut={opacity:1};opts.cssBefore={top:0,left:0};};$.fn.cycle.transitions.uncover=function($cont,$slides,opts){var d=opts.direction||"left";var w=$cont.css("overflow","hidden").width();var h=$cont.height();opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,true,true);if(d=="right"){opts.animOut.left=w;}else{if(d=="up"){opts.animOut.top=-h;}else{if(d=="down"){opts.animOut.top=h;}else{opts.animOut.left=-w;}}}});opts.animIn={left:0,top:0};opts.animOut={opacity:1};opts.cssBefore={top:0,left:0};};$.fn.cycle.transitions.toss=function($cont,$slides,opts){var w=$cont.css("overflow","visible").width();var h=$cont.height();opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts,true,true,true);if(!opts.animOut.left&&!opts.animOut.top){opts.animOut={left:w*2,top:-h/2,opacity:0};}else{opts.animOut.opacity=0;}});opts.cssBefore={left:0,top:0};opts.animIn={left:0};};$.fn.cycle.transitions.wipe=function($cont,$slides,opts){var w=$cont.css("overflow","hidden").width();var h=$cont.height();opts.cssBefore=opts.cssBefore||{};var clip;if(opts.clip){if(/l2r/.test(opts.clip)){clip="rect(0px 0px "+h+"px 0px)";}else{if(/r2l/.test(opts.clip)){clip="rect(0px "+w+"px "+h+"px "+w+"px)";}else{if(/t2b/.test(opts.clip)){clip="rect(0px "+w+"px 0px 0px)";}else{if(/b2t/.test(opts.clip)){clip="rect("+h+"px "+w+"px "+h+"px 0px)";}else{if(/zoom/.test(opts.clip)){var top=parseInt(h/2);var left=parseInt(w/2);clip="rect("+top+"px "+left+"px "+top+"px "+left+"px)";}}}}}}opts.cssBefore.clip=opts.cssBefore.clip||clip||"rect(0px 0px 0px 0px)";var d=opts.cssBefore.clip.match(/(\d+)/g);var t=parseInt(d[0]),r=parseInt(d[1]),b=parseInt(d[2]),l=parseInt(d[3]);opts.before.push(function(curr,next,opts){if(curr==next){return;}var $curr=$(curr),$next=$(next);$.fn.cycle.commonReset(curr,next,opts,true,true,false);opts.cssAfter.display="block";var step=1,count=parseInt((opts.speedIn/13))-1;(function f(){var tt=t?t-parseInt(step*(t/count)):0;var ll=l?l-parseInt(step*(l/count)):0;var bb=b<h?b+parseInt(step*((h-b)/count||1)):h;var rr=r<w?r+parseInt(step*((w-r)/count||1)):w;$next.css({clip:"rect("+tt+"px "+rr+"px "+bb+"px "+ll+"px)"});(step++<=count)?setTimeout(f,13):$curr.css("display","none");})();});opts.cssBefore={display:"block",opacity:1,top:0,left:0};opts.animIn={left:0};opts.animOut={left:0};};})(jQuery);<br /><br />//]]><br /></script><br /><br /><script type='text/javascript'><br />/* <![CDATA[ */<br />jQuery.noConflict();<br />jQuery(function(){ <br /> jQuery('ul.menu-primary').superfish({ <br /> animation: {opacity:'show'},<br />autoArrows: true,<br /> dropShadows: false, <br /> speed: 200,<br /> delay: 800<br /> });<br /> });<br /><br />jQuery(function(){ <br /> jQuery('ul.menu-secondary').superfish({ <br /> animation: {opacity:'show'},<br />autoArrows: true,<br /> dropShadows: false, <br /> speed: 200,<br /> delay: 800<br /> });<br /> });<br /><br />jQuery(document).ready(function() {<br /> jQuery('.fp-slides').cycle({<br /> fx: 'fade',<br /> timeout: 4000,<br /> delay: 0,<br /> speed: 1000,<br /> next: '.fp-next',<br /> prev: '.fp-prev',<br /> pager: '.fp-pager',<br /> continuous: 0,<br /> sync: 1,<br /> pause: 1,<br /> pauseOnPagerHover: 1,<br /> cleartype: true,<br /> cleartypeNoBg: true<br /> });<br /> });<br /><br />/* ]]> */<br /><br /></script><br /></pre><br />+ Tìm <b>]]></b:skin></b><br />thêm đoạn code sau vào trước nó:<br /><pre>/*-------------------- MBT jQuery Image Slider -------------*/<br />.featuredposts{border:1px solid #E9E7DE;<b><span style="color: red;">width:608px</span></b>;background:#FFF;margin:0 0 10px 0;<b><span style="color: red;">height:400px</span></b>;overflow:hidden;} <br />.fp-slides{} <br />.fp-post{padding:13px;} <br />.fp-thumbnail{border:3px solid #dddddd; width:580px;height:266px;margin-bottom:10px;overflow:hidden;} <br />.fp-thumbnail:hover{border:3px solid #CAC9C9; width:580px;height:266px;margin-bottom:10px;overflow:hidden;} <br />.fp-title{color:#787878;font:bold 14px Arial, Helvetica, Sans-serif;padding:0 0 4px 0;margin:0; text-transform:uppercase;} <br />.fp-title a{color:#000;text-decoration:none;} <br />.fp-title a:hover{color:#0080fF;text-decoration:none;} <br />.fp-label{color:#504D4D;margin:15px 15px 0 15px;padding:0;text-transform:uppercase;font:bold 16px/16px Arial,Helvetica,Sans-serif;} <br />.fp-post p{color:#504D4D;padding:0;margin:0;font:10px Arial,Helvetica,Sans-serif;height:32px;overflow:hidden;} <br />.fp-more,.fp-more:hover{color:#F77C04;font-weight:bold;} <br />.fp-nav{width:590px;padding:0px 10px;height:14px;} <br />.fp-pager a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8uwOeSfRAayyi_6lfBij_gxm8XLhPRUkX39TlFk6zq8rBJgvp31i2TjSD_GyZz-Tbja6EX-dkZLv_QDWKJnc0UiSk2d_7Pxp1dedpKt2GmKEpX3QW6jAM90lFUiYFHHq27hCLmep_jgE/s1600/featured-pager.png);cursor:pointer;margin:3px 6px 0 0;padding:0;height:10px;width:10px;display:block;float:left;overflow:hidden;text-indent:-999px;background-position:0 0;} <br />.fp-pager a:hover,.fp-pager a.activeSlide{text-decoration:none;background-position:0 -110px;} <br />.fp-prev{float:right;margin-right:4px;width:15px;height:17px;opacity:0.7;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZzudsr5VUiTDgVE19jJk_p9L-hQ3MYBQ9NjiM5bfKQA2My2ajiTijBzXlwg8AFjOnNDq594_LWEBM7hL-CxSuJLD2RM3tcvUroJchWvZMxumif0JNxqo9S0MA5EOEgIkqTSlNfdlSlM8/s1600/featured-prev.png) top left no-repeat;} <br />.fp-prev:hover{opacity:1;} <br />.fp-prev:active{opacity:0.7;} <br />.fp-next{float:right;width:15px;height:17px;margin-left:4px;opacity:0.7;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrBJTDXeLhkSPFL63HrzsJw8PUgmJg17klb_VfSmrEPHcnSAX79id63QGPy-IOvlujyifnjR-uBSd8DJkfH8s415KB1TUsQcQpjt8JsSLr8XTufRqQdklA43G1AmoyhMKFRerXS6SZ06Q/s1600/featured-next.png;) top left no-repeat} <br />.fp-next:hover{opacity:1;} <br />.fp-next:active{opacity:0.7;}<br /></pre><br />+ Tìm  <b><div id='main-wrapper'></b><br /><div id="main-wrapper"></div>và thêm đoạn code sau vào trước nó:<br /><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGW5fZqWbhK8ocQiLQZDwM2tNzG9LJoa1hzS2dYsYGMyroUt_88kXqhSJyQ-KIY-S7yhygtsbmknbAOdGON2CCfHRk0r2HTEebCH-PDdGVLFkqIs7Uq58Y3mKrdKsgMjpjqzh8pZgLyKQ/s1600/vusteven-demo.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGW5fZqWbhK8ocQiLQZDwM2tNzG9LJoa1hzS2dYsYGMyroUt_88kXqhSJyQ-KIY-S7yhygtsbmknbAOdGON2CCfHRk0r2HTEebCH-PDdGVLFkqIs7Uq58Y3mKrdKsgMjpjqzh8pZgLyKQ/s1600/vusteven-demo.png" /></a></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: left;"><br /></div><pre><b:if cond='data:blog.pageType != "static_page"'> <br /><b:if cond='data:blog.pageType != "item"'><br /><br /><div class='featuredposts clearfix'><br /><div class='fp-slides'><br /><div class='fp-post'> <br /><div class='fp-thumbnail'><a href='<b><span style="color: red;">URL bài viết 1</span></b>'><img src='<b><span style="color: red;">URL hình ảnh 1</span></b>'/></a></div><h3 class='fp-title'><a href='<b><span style="color: red;">URL bài viết 1</span></b>'><span style="color: red;"><b>TITLE</b></span>...</a></h3> <p> <b><span style="color: red;">Mô tả</span></b>... </p> <br /></div><br /><div class='fp-post'> <br /><div class='fp-thumbnail'><a href='<b><span style="color: red;">URL bài viết 2</span></b>'><img src='<b><span style="color: red;">URL hình ảnh 2</span></b>'/></a></div> <br /><h3 class='fp-title'><a href='<b><span style="color: red;">URL bài viết 2</span></b>'><span style="color: red;"><b>TITLE</b></span>...</a></h3> <p> <b><span style="color: red;">Mô tả</span></b>... </p> <br /></div><br /><div class='fp-post'> <br /><div class='fp-thumbnail'><a href='<b><span style="color: red;">URL bài viết 3</span></b>'><img src='<b><span style="color: red;">URL hình ảnh 3</span></b>'/></a></div> <br /><h3 class='fp-title'><a href='<b><span style="color: red;">URL bài viết 3</span></b>'><span style="color: red;"><b>TITLE</b></span>...</a></h3> <p> <b><span style="color: red;">Mô tả</span></b>... </p> <br /></div><br /><div class='fp-post'> <br /><div class='fp-thumbnail'><a href='<b><span style="color: red;">URL bài viết 4</span></b>'><img src='<b><span style="color: red;">URL hình ảnh 4</span></b>'/></a></div> <br /><h3 class='fp-title'><a href='<b><span style="color: red;">URL bài viết 4</span></b>'><b style="color: red;">TITLE</b>...</a></h3> <p> <b><span style="color: red;">Mô tả</span></b>... </p> <br /></div><br /><div class='fp-post'> <br /><div class='fp-thumbnail'><a href='<b><span style="color: red;">URL bài viết 5</span></b>'><img src='<b><span style="color: red;">URL hình ảnh 5</span></b>'/></a></div> <br /><h3 class='fp-title'><a href='<b><span style="color: red;">URL bài viết 5</span></b>'><b style="color: red;">TITLE</b>...</a></h3> <p> <b><span style="color: red;">Mô tả.</span></b>.. </p> <br /></div><br /></div> <br /><div class='fp-nav clearfix'> <br /><span class='fp-pager'/> <br /><a class='fp-next' href='#fp-next'/> <br /><a class='fp-prev' href='#fp-prev'/> <br /></div> <br /> <br /></div><br /><br /></b:if></b:if><br /></pre><br /><span style="color: red;"><b>Chú ý:</b></span> bạn hãy thay các dòng <span style="color: red;"><b>màu đỏ</b></span> cho phù hợp với <a href="http://www.vusteven.info/"><b>blogger</b></a> của bạn nhé<br /><br /><b><span style="color: blue;">Chúc các bạn thành công</span></b>

• 
• 
• 
• 
• 
• 

1. 1
2. 2
3. 3
4. 4
5. 5
6. 6

• Previous
• Next

jQuery trượt hình ảnh cho Blogger

Demo:+ Đăng nhập Blogger => Thiết kế => Chỉnh sửa HTML  - Tìm thêm đoạn code sau vào trước nó//(function($){ /* hoverIntent by Brian Cherne */ $.fn.hoverIntent = function(f,g) { // default configurat…

Đọc thêm »

Thêm Sidebar bài viết mới đẹp cho blogger

<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnYmOPWROQPPzIYWv8WUkW_EzS7ODCCCfg4Ihxm-W6F0THcnf6TuWICzghERDrRfZ5N8XMs7nqS8cOTEq0X6aEc-ULbRyMQxjU6HMen5-vdCNnd6_aNEakuTCj8EKH61U7tS38MGjm5NI/s1600/baivietmoi-vusteven.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnYmOPWROQPPzIYWv8WUkW_EzS7ODCCCfg4Ihxm-W6F0THcnf6TuWICzghERDrRfZ5N8XMs7nqS8cOTEq0X6aEc-ULbRyMQxjU6HMen5-vdCNnd6_aNEakuTCj8EKH61U7tS38MGjm5NI/s1600/baivietmoi-vusteven.png" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Demo</td></tr></tbody></table><br />Hôm nay mình hướng dẫn các bạn thêm <b>Sidebar</b> bài viết mới cho <b>blogger</b> đẹp + chuẩn hơn hết là nhẹ ^^<br />có demo ngay trên trang <b><a href="http://www.vusteven.info/">Vũ Steven</a> </b><br /><b><br /></b> <b><br /></b> <b><br /></b><br /><br /><pre><style scoped="" type="text/css"><br />ul.rcentside *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}<br />ul.rcentside{font:normal normal 11px Verdana,Geneva,sans-serif}<br />ul.rcentside,ul.rcentside li{margin:0;padding:0;list-style:none;position:relative}<br />ul.rcentside{width:100%;height:500px}<br />ul.rcentside li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none}<br />ul.rcentside li:nth-child(1),ul.rcentside li:nth-child(2),ul.rcentside li:nth-child(3),ul.rcentside li:nth-child(4){display:block}<br />ul.rcentside img{border:0;width:100%;height:100%}<br />ul.rcentside li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0}<br />ul.rcentside li:nth-child(2){left:0;top:50%}<br />ul.rcentside li:nth-child(3){left:50.5%;top:50%}<br />ul.rcentside li:nth-child(4){width:100%;left:0;top:75%}<br />ul.rcentside .overlayx,ul.rcentside li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}<br />ul.rcentside .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieh1Gq3EXfvbf_H31gfCb8tAWRO8kOUe6H6hkEhnVCiM10uHFTnmZApOkH8Ry2l-juPkfI0sptLZhnYhsUPyDxP2bC6639Az5JncqZjdcFVgFCvHis08-2mExAKd_XfSlPG7uR0ioMB_0/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x}<br />ul.rcentside .overlayx,ul.rcentside img{border:4px solid #2E8DCE;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}<br />ul.rcentside li:nth-child(1) .overlayx{background-position:50% 25%}<br />ul.rcentside .overlayx:hover{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}<br />ul.rcentside h4{position:absolute;bottom:30px;z-index:2;color:white;margin:0;width:100%;padding:0 10px;line-height:1.5em;font-family:Georgia,Times,"Times New Roman";font-weight:normal}<br />ul.rcentside li:nth-child(1) h4,ul.rcentside li:nth-child(4) h4{font-size:150%}<br />ul.rcentside .label_text{position:absolute;bottom:10px;left:10px;z-index:2;color:white;font-size:90%}<br />ul.rcentside li:nth-child(2) .autname,ul.rcentside li:nth-child(3) .autname{display:none}<br />.buttons{margin:5px 0 0}<br />.buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}<br />.buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}<br />.buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px}<br /></style><br /><div id="featuredpostside"></div><br /><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script><br /><script type="text/javascript">function FeaturedPostSide(a){(function(e){var h={blogURL:"",MaxPost:4,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="sliderx"><ul class="rcentside"></ul></div><div class="buttons"><a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.MonthNames[parseInt(p,10)-1];l+='<li><a target="_blank" href="'+q+'"><div class="overlayx"></div><img class="random" src="'+u+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .sliderx li:last").after(e(h.idcontaint+" .sliderx li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));e(h.idcontaint+" .sliderx").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};</script><br /><script type='text/javascript'><br />//<![CDATA[<br />FeaturedPostSide({<br />blogURL:"<b><span style="color: red;">http://www.vusteven.info</span></b>",<br />MaxPost:8,<br />idcontaint:"#featuredpostside",<br />ImageSize:300,<br />interval:5000,<br />autoplay:true,<br />tagName:false<br />});<br />//]]><br /></script><br /></pre><br /><b>Chú ý : bạn thay link</b> <b><span style="color: red;">http://www.vusteven.info </span>thành link của bạn nhen</b><br /><b><br /></b><b><span style="color: red; font-size: large;">Chúc các bạn thành công !</span></b>

Thêm Sidebar bài viết mới đẹp cho blogger

DemoHôm nay mình hướng dẫn các bạn thêm Sidebar bài viết mới cho blogger đẹp + chuẩn hơn hết là nhẹ ^^có demo ngay trên trang Vũ Steven  ul.rcentside *{-moz-box-sizing:border-box;-webkit-box-sizing:b…

Đọc thêm »

Ông ý muốn cái...tù tì :D

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqwM8NPsJmYV-BGn_gA1-sIA37uAO_MG3XUb_mTi5o8QypEHktNDnbi7WP4C882KQtJraxz15J8Br8D399zGHtGtmXVcnbRxhaB-bLgGBDzy9NZqAd3VQPnnrULEyzwIL5fu4Sjl8sJw4/s1600/ong+y+muon+gi+nao-+vusteven.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqwM8NPsJmYV-BGn_gA1-sIA37uAO_MG3XUb_mTi5o8QypEHktNDnbi7WP4C882KQtJraxz15J8Br8D399zGHtGtmXVcnbRxhaB-bLgGBDzy9NZqAd3VQPnnrULEyzwIL5fu4Sjl8sJw4/s1600/ong+y+muon+gi+nao-+vusteven.JPG" /></a></div><br />

Ông ý muốn cái...tù tì :D

…

Đọc thêm »