Chào các bạn, đã lâu lắm rồi mình chưa viết bài về thủ thuật blogspot, trong hôm nay mình xin chia sẽ lại các bạn menu chuột phải tuyệt đẹp này.
Không vòng vo tam quốc nữa, đi vào vấn đề chính!!.
Tạo menu chuột phải tuyệt đẹp cho blogspot


Các bước thực hiện

Bước 1: Chèn đoạn CSS sau vào trước ]]></b:skin>
ul.contextMenu{list-style:none;margin:0;padding:0;font:400 15px 'Roboto',sans-serif;position:absolute;color:#333;box-shadow:0 0 70px rgba(0,0,0,.15);z-index:999}
ul.contextMenu li{min-width:150px;overflow:hidden;white-space:nowrap;padding:12px 15px;background-color:#fff;border-bottom:1px solid #ecf0f1}
ul.contextMenu li a{color:#333;text-decoration:none}
ul.contextMenu li:hover{background-color:#ecf0f1}
ul.contextMenu li:first-child{border-radius:5px 5px 0 0}
ul.contextMenu li:last-child{background:#ecf0f1;border-bottom:0;border-radius:0 0 5px 5px}
ul.contextMenu li:last-child a{width:26%}
ul.contextMenu li:last-child:hover a{color:#2c3e50}
ul.contextMenu li:last-child:hover a:hover{color:#2980b9}
Bước 2: Chèn đoạn code sau vào nơi bất kì.
<ul class='contextMenu' hidden='1'>
<li><a href='/'><i class='fa fa-home'></i> Trang chủ</a></li>
<li><a href='/contact'><i class='fa fa-envelope'></i> Liên hệ</a></li>
<li><a href='/hop-tac'><i class='fa fa-link'></i> Hợp tác</a></li>
<li>
<a class='fa fa-facebook' href='//m.facebook.com/sharer/sharer.php?u=https://www.starcuongit.com/' onclick='window.open(this.href, "_blank", "height=430,width=640"); return false;' title='Chia sẻ lên Facebook'></a>
<a class='fa fa-google-plus' href='//plus.google.com/share?url=https://www.starcuongit.com/' onclick='window.open(this.href, "_blank", "height=430,width=640"); return false;' target='_blank' title='Chia sẻ lên Google'></a>
<a class='fa fa-twitter' href='#'></a>
<a class='fa fa-link' onclick='CopyLink()' style='cursor: pointer;' title='Sao chép liên kết của bài viết'></a>
</li>
</ul>
<script type='text/javascript'>
function copyTextToClipboard(e){var t=document.createElement("textarea");t.style.position="fixed",t.style.top=0,t.style.left=0,t.style.width="2em",t.style.height="2em",t.style.padding=0,t.style.border="none",t.style.outline="none",t.style.boxShadow="none",t.style.background="transparent",t.value=e,document.body.appendChild(t),t.select();try{document.execCommand("copy"),alert("Đã sao chép liên kết!")}catch(o){alert("Không thể sao chép liên kết!")}document.body.removeChild(t)}function CopyLink(){copyTextToClipboard(location.href)};
  $(document).bind("contextmenu", function(event) {
    event.preventDefault();
    $("ul.contextMenu")
        .show()
        .css({top: event.pageY + 15, left: event.pageX + 10});
});
$(document).click(function() {
  isHovered = $("ul.contextMenu").is(":hover");
  if (isHovered == false){
    $("ul.contextMenu").fadeOut("fast");
  }
});
</script> 
Bước 3: Sửa các thông tin sao cho phù hợp với blog bạn & Lưu template
Source code of thuthuatweb
Edited by bacsiwindows

CHIA SẺ BÀI VIẾT

- - 0 bình luận
CHUYÊN MỤC

BÌNH LUẬN (0)