Hướng dẫn tạo thêm Menu mở rộng đầu trang / Cuối trang - SideBar trượt Left Right giống Blogspot DigittalNomad.Vn
MeNu Đơn Giản : Đây là thủ thuật blogspot tạo cấu trúc Menu điều hướng dạng Div dạng Text đơn giản & tạo menu dạng list, box share link, điều hướng đơn giản thích hợp dùng chèn vào SideBar - Trang Chủ - Trang Nhãn Blogspot :
MeNu dạng Div :
<b>
Gợi ý :
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/06/tong-hop-html-css-javascript-du-kieu-chen-vao-blogspot-website-cua-banNhi687.html">Html, Css, JavaScript </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/09/thu-thuat-blogspot-su-dung-cac-loai-the-blogger21Ki.html">LayOut Tags BlogSpot </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/p/tips.html#danhsachPopup">Popup </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/07/tong-hop-thu-thuat-code-web-giup-ban-thiet-ke-giao-dien-website-kiem-tien-dep-chuan-ui-uxBris526.html">Web Ui Ux </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/search/label/Consignment">Bán Ký Gửi </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/search/label/Business">Kinh Doanh </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/03/mmo-kiem-tien-online-tu-website-khong-kho-nhung-phai-biet-cachVoi297.html">MMO </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/search/label/Marketing">Marketing </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/search/label/Du%20L%E1%BB%8Bch%20Ki%E1%BA%BFm%20Ti%E1%BB%81n">Du Lịch Kiếm Tiền </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/08/keyword-tu-khoa-seo-top-google-tren-Blog-Gia-BaoKsaiz9.html">Seo Lên Top Google </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/05/thiet-ke-landing-page-chay-quang-cao-google-ads-blog-web-content-marketingTo9p.html">Landing Page & Google Ads </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/06/nen-tang-mmo-mang-luoi-ad-network-cach-kiem-tien-online-viec-lam-tai-nhaTwoKe8o9.html">
Ad NetWork / Google Adsense / Mgid </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/p/list.html">
List </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/p/tips.html">
Tips </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/p/knowledge-experience-skill.html">
List Kiến Thức, Kinh Nghiệm, Kỹ Năng </a>
<b style="color:blue">#</b><a href="https://www.digitalnomad.vn/2021/03/Review-BlogVurYum2E1.html">
Review </a>
</b>
</div>
<style type="text/css">
#gb{
position:fixed;
top:90px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
cursor:pointer;
background:url('https://2.bp.blogspot.com/-gJsNMloh51g/WblGu-aejuI/AAAAAAAAByw/qMDNpSSrlCgKPtTxoekvBf9UPChW36fWwCLcBGAs/s1600/MENU_RIGHT.png') no-repeat; }
.gbcontent{
float:left;
border:2px solid #990000;
background:#F5F5F5;
padding:10px;
} </style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
<a href="#">
Code Blogspot DigitalNomad.Vn
</a>
<br/>
<a href="https://digitalnomadplus.blogspot.com/p/sitemap.html">Sitemap - Sơ đồ trang</a>
<div style="text-align:right">
<a href="javascript:showHideGB()">
[Hide]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
Sticky Menu - cố định cuối trang :
<!--chen Stiky menu chan trang -->
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
<!--mau Iris-->
<style>
.sticky-bottom{position:fixed;bottom:0;width:100%;max-width:2024px;z-index:999;background:#f2f2f2;padding-top:5px;text-align:center;box-sizing:border-box;}
.button-sticky-bottom{position:absolute;width:40px;height:30px;background:#f2f2f2;top:-30px;padding:10px;border-radius:100%;z-index:97;left:50%;margin-left:-30px;text-align:center;}
#mobile-navi, #mobile-share-bottom{position:relative!important;z-index:98!important;}
#mobile-navi{z-index:999;position:fixed;margin:0!important;padding-bottom:15px;bottom:0;left:0;width:100%;height:40px;background:#fff;border-top:1px solid #eee;box-shadow:0 -1px 5px -2px rgba(0,0,0,0.1);overflow:hidden;}
#mobile-navi li{width:25%;height:40px;float:left;}
#mobile-navi li a{display:block;width:100%;height:100%;font-family:sans-serif;font-size:12px;font-weight:400;color:#555;text-align:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
#mobile-navi li a:hover{color:#00a1d6}
#mobile-navi li a span[class*="ti-"]{display:block;width:100%;height:25px;line-height:28px;font-size:14px;margin-top:0}
#mobile-navi li a a{color:#555}
.ti-home:before{content:"f015";font-family:FontAwesome;}
.ti-search:before{content:"f002";font-family:FontAwesome;}
.ti-label:before{content:"f00a";font-family:FontAwesome;}
.ti-service:before{content:"f07a";font-family:FontAwesome;}}
</style>
<center>
<div class='sticky-bottom'>
<a class='button-sticky-bottom' href='javascript:;'>
<i class='fa fa-sort fa-lg'/></a>
<ul id='mobile-navi' style='display: block;'>
<li class='btnHome' style='list-style-type:none;'>
<a href='/' title='Trang chủ'>
<span class='ti-home'/>Trang chủ</a>
</li>
<li class='btnSearchMobile' style='list-style-type:none;'>
<a href='#' title='Tìm kiếm'><span class='ti-search'/>Tìm kiếm</a> </li>
<li class='btnLabel' style='list-style-type:none;'>
<a href='#' title='Danh mục'><span class='ti-label'/>Danh mục</a> </li>
<li class='btnService' style='list-style-type:none;'>
<a href='#' title='Store'><span class='ti-service'/>Cửa hàng</a> </li>
</ul>
</div>
</center>
<script type='text/javascript'>
$('.button-sticky-bottom').click(function(){
$("#mobile-navi").slideToggle();
})
</script>
<!--end mau Iris-->
Sticky menu Helper101 đầu trang :
<link rel="stylesheet" type="text/css" href="https://rawgit.com/101Helper/docs/master/slideout-nav-public.css" />
<nav id="nava" role="navigation" class="sticky-nav" style="top: 0px;">
<form id="searchbox" method="get" action="/search">
<input name="q" type="text" id="search-in" size="19" required />
<input name="m" type="hidden" value="1" />
<button type="submit" class="_54k8 _56bs _56b_ _56bw _56bu" id="u_0_1" data-sigil="touchable"><span class="_55sr">Go!</span></button>
<img id="hide-search" src="http://1.bp.blogspot.com/-tKEvMrl1rNg/VlHno1INErI/AAAAAAAAEDM/p6QC4v0mUGg/s1600/rsz_close-icon.jpg" />
<div id="search-height"></div>
</form>
<div class="prl-container">
<div class="nav-wrapper clearfix">
<img id="show-search" src="http://2.bp.blogspot.com/-JJaM7cFOVhQ/VlHnpNl_awI/AAAAAAAAEDU/DoJe685oe7w/s1600/rsz_search-icon.png" />
<div style="float:left;">
<div class="nav_menu_control"><a href="#" data-prl-offcanvas="{target:'#offcanvas'}"><img src="http://1.bp.blogspot.com/-pb2BSgtLzLA/VlHnpOZWKCI/AAAAAAAAEDQ/T3ujbHq-QXE/s1600/rsz_mobile-menu-icon.png"/></a></div>
</div>
<div class="container">
<div class="left">
<a href="/"><img src="https://1.bp.blogspot.com/-SpNGqoBgni0/YAo0WxDPMKI/AAAAAAAACgE/Aq3HYBeiuawJWvA-nrYS3nmhSxhz81MrgCLcBGAsYHQ/s16000/Du-lich-Kiem-tien-tu-website-DigitalNomad.vn-Z5Q1.png" class="logo" alt="Một trăm lẻ 1 Helper Blogspot"/></a>
</div>
<div class="clear"></div></div></div></div></nav><div style="clear: both;"></div>
<div id="offcanvas" class="prl-offcanvas">
<div class="prl-offcanvas-bar">
<div class="social-icons" style="padding-top: 5px;background: #fff;padding-left: 5px;"> <p>Follow us:</p>
<a href="#"><img border="0" src="http://2.bp.blogspot.com/-GQPoAuiBzH8/VkyJRB21uUI/AAAAAAAAECk/hu0P8MunxW0/s1600/facebook.png" /></a> <a href="#"><img border="0" src="http://4.bp.blogspot.com/-fWnS_YBm4Fk/VkyJtu17mhI/AAAAAAAAEC0/7ujWxnTR9S0/s1600/Twitter-Logo.png" /></a>
<a href="#"><img border="0" src="http://2.bp.blogspot.com/-Y4pUO8DhyRI/VkyJRMUnxFI/AAAAAAAAECs/3K3W7_XD4eM/s1600/App-Pinterest-icon.png" /></a>
<a href="#"><img border="0" src="http://4.bp.blogspot.com/-JWK2kZI99O4/VkyJRB8aZYI/AAAAAAAAECo/rX64EboMhD4/s1600/rsz_circle-google-plus-128.png" /></a> </div>
<nav class="side-nav">
<ul id="nav-list" class="nav-list">
<li><a href="/">Home</a></li>
Blog - Web liên quan
<li><a href="#">Dulichkythuatso.blogspot.com</a></li>
<li><a href="#">DigitalNomadPlus.blogspot.com</a></li>
Kinh doanh :
<li><a href="#">Thớt gỗ</a></li>
<li><a href="#">Gỗ xẻ sấy</a></li>
<li><a href="#">Gỗ ghép</a></li>
<li><a href="#">Ván gỗ lót gác</a></li>
<li><a href="#">Bàn ghế Cafe - Bàn ghế</a></li>
Hợp tác Marketing content
<li><a href="#">Dịch vụ kế toán</a></li>
<li><a href="#">Rèm cửa</a></li>
Content Writing
<li><a href="#">Du Lịch</a></li>
<li><a href="#">Thiết kế web BlogSpot</a></li>
<!--
Review
Dụng cụ nhà bếp bằng gỗ
Quán cafe
Web Seo :
Goghepthanh.com
DichvuketoanPlus.com
Web Content Marketing
Vietquangcao.xyz
DigitalNomad.VN
<li><a href="#">Blogger tips and tricks</a></li>
<li><a href="#">Blogger seo</a></li>
<li><a href="#">Google webmaster tools tutorials</a></li>
<li><a href="#">Bing webmaster tools tutorials</a></li>
<li><a href="#">Blogger menus</a></li>
<li><a href="#">Earn money blogging</a></li>
<li><a href="#">Blogger gadgets</a></li>
<li><a href="#">How to's/Blogging</a></li>
<li><a href="#">Mobile blogging</a></li> -->
<li><a href="#">Sitemap</a></li> <a class="abt" href="#"><img src="https://4.bp.blogspot.com/-Et4EX_hsQDI/V35jh5bmRGI/AAAAAAAAFfU/bHaT1rx1d2AMPWWS-2nWKgrjytLxSfq-ACLcB/s1600/abt.png"/>DigitalNomad.VN</a>
</ul>
</nav>
</div></div>
<script type='text/javascript' src='https://rawgit.com/101Helper/docs/master/slideout_mobile_menu.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type='text/javascript' src='https://rawgit.com/101Helper/docs/master/slideout_mobile_menu.js'></script> <script>
$(document).ready(function(){
$("#hide-search").click(function(){
$("#searchbox").hide();
});
$("#show-search").click(function(){
$("#searchbox").show();
});
});
</script>
<div id='menu-height'/></div>
<style>
@import url(//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css);
}
@import url(http://fonts.googleapis.com/css?family=Titillium+Web:300);
.logo{
}
.settings {
height:73px;
float:left;
background-image:url(http://s3.postimg.org/bqfooag4z/startific.jpg);
background-repeat:no-repeat;
width:250px;
margin:0px;
text-align: center;
font-size:20px;
font-family: 'Strait', sans-serif;
}
.hover {
height:73px;
float:left;
background-image:url(http://s27.postimg.org/4hhl2szcf/startific_small.jpg);
background-repeat:no-repeat;
width:255px;
margin:0px;
}
.fa-lg {
font-size: 1em;
}
.fa {
position: relative;
display: table-cell;
width: 55px;
height: 36px;
text-align: center;
top:12px;
font-size:20px;
}
.main-menu:hover, nav.main-menu.expanded {
width:250px;
overflow:hidden;
opacity:1;
}
.main-menu {
background:#F7F7F7;
border-right:1px solid #e5e5e5;
position:absolute;
top:0;
bottom:0;
height:100%;
left:0;
width:55px;
overflow:hidden;
-webkit-transition:width .2s linear;
transition:width .2s linear;
-webkit-transform:translateZ(0) scale(1,1);
box-shadow: 1px 0 15px rgba(0, 0, 0, 0.07);
opacity:1;
}
.main-menu>ul {
margin:7px 0;
}
.main-menu li {
position:relative;
display:block;
width:250px;
}
.main-menu li>a {
position:relative;
width:255px;
display:table;
border-collapse:collapse;
border-spacing:0;
color:#959595;
font-size: 14px;
text-decoration:none;
-webkit-transform:translateZ(0) scale(1,1);
-webkit-transition:all .14s linear;
transition:all .14s linear;
font-family: 'Strait', sans-serif;
border-top:1px solid #F0F0F0;
box-shadow:inset 0 1px 1px #FAFAFA;
text-shadow: 1px 1px 1px #fff;
}
.main-menu .nav-icon {
position:relative;
display:table-cell;
width:55px;
height:36px;
text-align:center;
vertical-align:middle;
font-size:18px;
}
.main-menu .nav-text {
position:relative;
display:table-cell;
vertical-align:middle;
width:190px;
font-family: 'Titillium Web', sans-serif;
}
.main-menu .share {
}
.main-menu .fb-like {
left: 180px;
position:absolute;
top: 15px;
}
.main-menu>ul.logout {
position:absolute;
left:0;
bottom:0;
}
.no-touch .scrollable.hover {
overflow-y:hidden;
}
.no-touch .scrollable.hover:hover {
overflow-y:auto;
overflow:visible;
}
.settings:hover, settings:focus {
background:url( http://s3.postimg.org/bqfooag4z/startific.jpg);
}
a:hover,a:focus {
text-decoration:none;
border-left:0px solid #F7F7F7;
}
nav {
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-o-user-select:none;
user-select:none;
}
nav ul,nav li {
outline:0;
margin:0;
padding:0;
}
.main-menu li:hover>a,nav.main-menu li.active>a,.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus,.no-touch .dashboard-page nav.dashboard-menu ul li:hover a,.dashboard-page nav.dashboard-menu ul li.active a {
color:#fff;
background-color:#00bbbb;
text-shadow: 0px 0px 0px;
}
.area {
float: left;
background: #e2e2e2;
width: 100%;
height: 100%;
}
@font-face {
font-family: 'Titillium Web';
font-style: normal;
font-weight: 300;
src: local('Titillium WebLight'), local('TitilliumWeb-Light'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v2/anMUvcNT0H1YN4FII8wpr24bNCNEoFTpS2BTjF6FB5E.woff) format('woff');
}
</style>
<nav class="main-menu">
<div class="logo">
</div>
<div class="settings">
</div>
<ul>
<li>
<a href="/">
<i class="fa fa-home fa-lg"></i>
<span class="nav-text">Home</span>
</a>
</li>
<!--
<li>
<a href="#">
<i class="fa fa-heart-o fa-lg"></i>
<span class="share">
<div class="addthis_default_style addthis_32x32_style">
<div style="position:absolute;
margin-left: 56px;top:3px;">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_google_plusone_share"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4ff17589278d8b3a"></script>
</span>
<span class="twitter"></span>
<span class="google"></span>
<span class="nav-text">
</span>
</a>
</li>
-->
<li class="has-subnav">
<a href="#">
<i class="fa fa-clock-o fa-lg"></i>
<span class="nav-text">
News
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-desktop fa-lg"></i>
<span class="nav-text">
Technology
</span>
</a>
</li>
<li class="has-subnav">
<a href="#">
<i class="fa fa-plane fa-lg"></i>
<span class="nav-text">
Travel
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-shopping-cart"></i>
<span class="nav-text">
Shopping
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-microphone fa-lg"></i>
<span class="nav-text">
Film & Music
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-flask fa-lg"></i>
<span class="nav-text">
Web Tools
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-picture-o fa-lg"></i>
<span class="nav-text">
Art & Design
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-align-left fa-lg"></i>
<span class="nav-text">
Magazines
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-gamepad fa-lg"></i>
<span class="nav-text">
Games
</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-glass fa-lg"></i>
<span class="nav-text">
Life & Style
</span>
</a>
</li>
<li class="has-subnav">
<a href="#">
<i class="fa fa-rocket fa-lg"></i>
<span class="nav-text">
Fun
</span>
</a>
</li>
</ul>
<ul class="logout">
<li>
<a href="#">
<i class="fa fa-lightbulb-o fa-lg"></i>
<span class="nav-text">
BLOG
</span>
</a>
</li>
</ul>
</nav>
</div>
Side menu trượt dọc bên trái
<script type='text/javascript'>
//<![CDATA[
/*
Configure menu styles below
NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
*/
YOffset=300; // no quotes!!
XOffset=0;
staticYOffset=30; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="#ccc";
menuIsStatic="yes"; //this sets whether menu should stay static on the screen
menuWidth=150; // Must be a multiple of 10! no quotes!!
menuCols=2;
hdrFontFamily="verdana";
hdrFontSize="2";
hdrFontColor="white";
hdrBGColor="#4cab21";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="15";
linkFontFamily="Verdana";
linkFontSize="2";
linkBGColor="white";
linkOverBGColor="#f2f2f2";
linkTarget="_top";
linkAlign="Left";
barBGColor="#111";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barVAlign="center";
barWidth=15; // no quotes!!
barText="TIỆN ÍCH"; // <IMG> tag supported. Put exact html for an image to show.
///////////////////////////
/* Menu settings start */
// ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header
ssmItems[0]=["Menu"] //create header
ssmItems[1]=["Home", "http://tranphucminh.blogspot.com/", ""]
ssmItems[2]=["Liên hệ", "http://tranphucminh.blogspot.com/2011/11/lien-he.html",""]
ssmItems[3]=["Sơ đồ", "http://tranphucminh.blogspot.com/2011/10/sitemap.html#", ""]
ssmItems[4]=["Blog Huy", "http://www.tranminhhuy.tk/", ""]
ssmItems[5]=["Nhạc", "http://nhacblogminh.blogspot.com/", ""]
ssmItems[6]=["Blog Phim, Nhạc", "http://blogphim.blogspot.com/", ""]
ssmItems[7]=["Blog Hình", "http://bloguploadhinh.blogspot.com/", ""]
ssmItems[8]=["Nick chat", "ymsgr:sendim?tpm1512", ""]
/* Menu settings end */
buildMenu();
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
//Static Slide Menu 6.5 � MaXimuS 2000-2001, All Rights Reserved.
//Site: http://www.absolutegb.com/maximus
//Script featured on Dynamic Drive (http://www.dynamicdrive.com)
//March 20th, 09'- Updated for IE8 compatibility
NS6 = (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")
tempBar='';barBuilt=0;ssmItems=new Array();
function truebody(){
return (document.compatMode!="BackCompat")? document.documentElement : document.body
}
moving=setTimeout('null',1)
function moveOut() {
if ((NS6||NS)&&parseInt(ssm.left)<0 || IE && ssm.pixelLeft<0) {
clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed);slideMenu(10)}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
function moveBack() {clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
function moveBack1() {
if ((NS6||NS) && parseInt(ssm.left)>(-menuWidth) || IE && ssm.pixelLeft>(-menuWidth)) {
clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);slideMenu(-10)}
else {clearTimeout(moving);moving=setTimeout('null',1)}}
function slideMenu(num){
if (IE) {ssm.pixelLeft += num;}
if (NS6) {ssm.left = parseInt(ssm.left)+num+"px";}
if (NS) {ssm.left = parseInt(ssm.left)+num; bssm.clip.right+=num;bssm2.clip.right+=num;}}
function makeStatic() {
if (NS||NS6) {winY = window.pageYOffset;}
if (IE) {winY = truebody().scrollTop;}
if (NS6||IE||NS) {
if (winY!=lastY&&winY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - (YOffset-(YOffset-winY)));}
else {smooth=0}
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (IE) bssm.pixelTop+=smooth;
if (NS6) bssm.top=parseInt(bssm.top)+smooth+"px"
if (NS) bssm.top=parseInt(bssm.top)+smooth
lastY = lastY+smooth;
setTimeout('makeStatic()', 1)}}
function buildBar() {
if(barText.indexOf('<IMG')>-1) {tempBar=barText}
else{for (b=0;b<barText.length;b++) {tempBar+=barText.charAt(b)+"<BR>"}}
document.write('<td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD>')}
function initSlide() {
if (NS6){ssm=document.getElementById("thessm").style;bssm=document.getElementById("basessm").style; bssm.clip="rect(0 "+document.getElementById("thessm").offsetWidth+" "+document.getElementById("thessm").offsetHeight+" 0)";ssm.visibility="visible";}
else if (IE) {ssm=document.all("thessm").style;bssm=document.all("basessm").style bssm.visibility = "visible";}
else if (NS) {bssm=document.layers["basessm1"];
bssm2=bssm.document.layers["basessm2"];ssm=bssm2.document.layers["thessm"];
bssm2.clip.left=0;ssm.visibility = "show";}
if (menuIsStatic=="yes") makeStatic();}
function buildMenu() {
if (IE||NS6) {document.write('<DIV ID="basessm" style="visibility:hidden;Position : Absolute ;Left : '+XOffset+'px ;Top : '+YOffset+'px ;Z-Index : 20;width:'+(menuWidth+barWidth+10)+'px"><DIV ID="thessm" style="Position : Absolute ;Left : '+(-menuWidth)+'px ;Top : 0 ;Z-Index : 20;" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER name="basessm1" top="'+YOffset+'" LEFT='+XOffset+' visibility="show"><ILAYER name="basessm2"><LAYER visibility="hide" name="thessm" bgcolor="'+menuBGColor+'" left="'+(-menuWidth)+'" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'px" bgcolor="'+menuBGColor+'"><TR><TD>')}
document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'px" bgcolor="'+menuBGColor+'">');
for(i=0;i<ssmItems.length;i++) {
if(!ssmItems[i][3]){ssmItems[i][3]=menuCols;ssmItems[i][5]=menuWidth-1}
else if(ssmItems[i][3]!=menuCols)ssmItems[i][5]=Math.round(menuWidth*(ssmItems[i][3]/menuCols)-1);
if(ssmItems[i-1]&&ssmItems[i-1][4]!="no"){document.write('<TR>')}
if(!ssmItems[i][1]){
document.write('<td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'px" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+ssmItems[i][5]+'" COLSPAN="'+ssmItems[i][3]+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+ssmItems[i][0]+'</b></font></td>')}
else {if(!ssmItems[i][2])ssmItems[i][2]=linkTarget;
document.write('<TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=''+linkOverBGColor+''" onmouseout="bgColor=''+linkBGColor+''" WIDTH="'+ssmItems[i][5]+'px" COLSPAN="'+ssmItems[i][3]+'"><ILAYER><LAYER onmouseover="bgColor=''+linkOverBGColor+''" onmouseout="bgColor=''+linkBGColor+''" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+ssmItems[i][1]+'" target="'+ssmItems[i][2]+'" CLASS="ssmItems">'+ssmItems[i][0]+'</DIV></LAYER></ILAYER></TD>')}
if(ssmItems[i][4]!="no"&&barBuilt==0){buildBar();barBuilt=1}
if(ssmItems[i][4]!="no"){document.write('</TR>')}}
document.write('</table>')
if (NS6){document.write('</TD></TR></TABLE>')}
if (IE||NS6) {document.write('</DIV></DIV>')}
if (NS) {document.write('</LAYER></ILAYER></LAYER>')}
theleft=-menuWidth;lastY=0;setTimeout('initSlide();', 1)}
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
/*
Configure menu styles below
NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
*/
YOffset=300; // no quotes!!
XOffset=0;
staticYOffset=30; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="#ccc";
menuIsStatic="yes"; //this sets whether menu should stay static on the screen
menuWidth=150; // Must be a multiple of 10! no quotes!!
menuCols=2;
hdrFontFamily="verdana";
hdrFontSize="2";
hdrFontColor="white";
hdrBGColor="#4cab21";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="15";
linkFontFamily="Verdana";
linkFontSize="2";
linkBGColor="white";
linkOverBGColor="#f2f2f2";
linkTarget="_top";
linkAlign="Left";
barBGColor="#111";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barVAlign="center";
barWidth=15; // no quotes!!
barText="TIỆN ÍCH"; // <IMG> tag supported. Put exact html for an image to show.
///////////////////////////
/* Menu settings start */
// ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header
ssmItems[0]=["Menu"] //create header
ssmItems[1]=["Home", "/", ""]
ssmItems[2]=["Liên hệ", "#",""]
ssmItems[3]=["Sơ đồ", "#", ""]
ssmItems[4]=["Blog Huy", "#", ""]
ssmItems[5]=["Nhạc", "#", ""]
ssmItems[6]=["Blog Phim, Nhạc", "#", ""]
ssmItems[7]=["Blog Hình", "#", ""]
ssmItems[8]=["Nick chat", "#", ""]
/* Menu settings end */
buildMenu();
//]]>
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script language = "Javascript">
$(document).ready(function() {
$("a[href*='#']:not([href='#])").click(function() {
let target = $(this).attr("href");
$('html,body').stop().animate({
scrollTop: $(target).offset().top
}, 1000);
event.preventDefault();
});
});
</script>
<style>
.menu-float-right {
width: 100px;
position: fixed;
top: 35%;
right: 0;
z-index: 99999;
}
.menu-float-right #group {
position: absolute;
right: 0px;
}
.menu-float-right ul {
padding: 0;
}
.menu-float-right #group ul li {
background: #5eb509;
position: relative;
border-radius: 3px;
border: 1px solid #fff;
list-style: none;
margin-bottom: 10px;
}
.menu-float-right #group ul li img {
width: 57px;
border-radius: 5px;
}
.menu-float-right #group ul li .mo-ta {
font-size: 9px;
text-align: center;
color: rgb(255, 255, 255);
position: absolute;
width: 90%;
left: 5%;
bottom: 5%;
margin-bottom: 0px;
}
</style>
<div class="menu-float-right">
<div id="group">
<ul>
<li class="bang-gia">
<a href="/huong-dan-thanh-toan/" target="blank"><img src="http://maylockhi2.ninhbinhweb.net/wp-content/uploads/2018/09/icon-thanh-toan.png" > <p class="mo-ta">Bảng giá</p>
</a>
</li>
<li class="khuyen-mai">
<a href="/khuyen-mai" target="blank"><img src="http://maylockhi2.ninhbinhweb.net/wp-content/uploads/2018/09/icon-qua-tang.png" > <p class="mo-ta">Khuyến mãi</p></a> </li>
<li class="tu-van">
<a href="/hoi-dap" target="blank"><img src="http://maylockhi2.ninhbinhweb.net/wp-content/uploads/2018/09/icon-lien-he.png" >
<p class="mo-ta">Tư vấn</p></a>
</li>
<li class="lien-he">
<a href="/lien-he" target="blank"><img src="http://maylockhi2.ninhbinhweb.net/wp-content/uploads/2018/09/icon-tu-van.png">
<p class="mo-ta">Liên hệ</p></a>
</li>
<li id="back_to_top" >
<a href="#top"><img src="http://maylockhi2.ninhbinhweb.net/wp-content/uploads/2018/09/icon-back-to-top.png" >
<p class="mo-ta">Lên đầu</p></a>
</li>
</ul>
</div>
</div>
Flagship, giá hời, đời cũ, cấu hình ngon, xem phim, chơi game, nghe nhạc cực đã. :
+ Iphone 11 :
Xem Tại Đây
+ Iphone 12 :
Xem Tại Đây
+ Iphone 13 :
Xem Tại Đây
+ Samsung Galaxy S20 FE :
Xem Tại Đây
+ Samsung Galaxy S22 Ultra 5G :
Xem Tại Đây
+ Vivo V23 5G 8GB/128GB :
Xem Tại Đây
+ Vivo V25e 4G 8GB/128GB :
Xem Tại Đây
+ Redmi Note 11 Pro 5G :
Xem Tại Đây
+ Xiaomi 12 Pro :
Xem Tại Đây
Điện Thoại Giá Rẻ, Chạy Grab, Tài Xế Công Nghệ :
+ Poco M4 Pro :
Xem Tại Đây
+ Oppo A54 :
Xem Tại Đây
+ Xiaomi Redmi Note 11 :
Xem Tại Đây
+ Samsung Galaxy A23 :
Xem Tại Đây
Smartphone Gaming Giá Rẻ, Tải App Kiếm Tiền Online, Cài Đặt Ứng Dụng Học Tập, Giải Trí, Xem Phim Nghe Nhạc, Chơi Game Online, :
+ Tecno Poca 3 :
Xem Tại Đây
+ Realme narzo 50i Prime :
Xem Tại Đây