Cách khoá tải về đoạn phim bằng jQuery

Đây là html của 1 đoạn phim

<video id="video-hidden" width="320" height="240" controls>
  <source src="ThisIsMyVideo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

<video width="320" height="240" controls>
  <source src="ThisIsMyVideo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

Để đoạn phim ẩn, ta chèn thêm 1 id là video-hidden, nếu có thể này thì ngăn không cho người dùng chọn chuột phải tải video về bằng cách dùng jQuery sau:

<script type="text/javascript">
jQuery(document).ready(function(){
   jQuery('#video-hidden').bind('contextmenu',function() { return false; });
});
</script>

Chúc bạn thành công

Read More

CSS Tricks

Tutorial về Css, dùng ngon lành cho jQuery. Đọc ở đây 

-Sưu tầm từ chia sẻ của Tuấn Vũ IT -

Read More

Đổi Trang Home của Blogger

Đổi Trang Home của Blogger

Bài viết ở đây

Read More

Thay đổi thuộc tính của thẻ a hay bất cứ thẻ gì khác bằng jQuery bằng thuộc tính attr

jQuery("#sidebar .page-item-1035 a").attr("href", "/products-services");

Theo thuốc tính mặc định hiển có, để không phải sửa nhiều thứ lỗi tùm lum thì dùng jQuery để thay đổi thuộc tính từ trước đó, cách đổi là jQuery().attr(tên thuộc tính, thuộc tính muốn thay đổi);

Read More

Cách đổi vị trí thẻ ul li bằng jQuery

Cách đổi vị trí thẻ ul li bằng jQuery

Đang sử dụng avada để làm sidebar thì bị lỗi này, template là //Template Name: Side Navigation.
Vấn đề là nó tự động sắp xếp theo alphabel cái menu ở bên trái theo function

• get_ancestors

, nhưng mà khách hàng muốn theo đúng cái menu được sắp xếp theo ý họ, và cách giải quyết là dùng insertAfter (chèn sau 1 thẻ nào đó).

Cái này có ích là tự sắp xếp lại cấu trúc của thẻ ul li, thay vị hiện tại là đang xếp theo alphabel.

    jQuery(".side-nav .page-item-313").insertAfter(".side-nav .page-item-311");
     jQuery(".children .page-item-811").insertAfter(".children .page-item-772");
  jQuery(".children .page-item-816").insertAfter(".children .page-item-811");
  jQuery(".children .page-item-827").insertAfter(".children .page-item-816");
  jQuery(".children .page-item-855").insertAfter(".children .page-item-827");

    jQuery(".side-nav .page-item-315").insertAfter(".side-nav .page-item-313");
         jQuery(".children .page-item-566").insertAfter(".children .page-item-542");
      jQuery(".children .page-item-572").insertAfter(".children .page-item-566");
      jQuery(".children .page-item-582").insertAfter(".children .page-item-572");
      jQuery(".children .page-item-602").insertAfter(".children .page-item-582");
      jQuery(".children .page-item-617").insertAfter(".children .page-item-602");

    jQuery(".side-nav .page-item-317").insertAfter(".side-nav .page-item-315");
      jQuery(".children .page-item-1193").insertAfter(".children .page-item-1083");
      jQuery(".children .page-item-1223").insertAfter(".children .page-item-1193");

    jQuery(".side-nav .page-item-319").insertAfter(".side-nav .page-item-317");
    jQuery(".side-nav .page-item-321").insertAfter(".side-nav .page-item-319");

    jQuery(".side-nav .page-item-1035").insertAfter(".side-nav .page-item-321");
    jQuery(".side-nav .page-item-323").insertAfter(".side-nav .page-item-1035");
    jQuery(".side-nav .page-item-325").insertAfter(".side-nav .page-item-323");
    jQuery(".side-nav .page-item-1263").insertAfter(".side-nav .page-item-325");
    jQuery(".side-nav .page-item-1656").insertAfter(".side-nav .page-item-1263");
   jQuery(".children .page-item-1349").insertAfter(".children .page-item-1283");
    jQuery(".children .page-item-1373").insertAfter(".children .page-item-1367");
    jQuery(".children .page-item-1385").insertAfter(".children .page-item-1373");
    jQuery(".children .page-item-1389").insertAfter(".children .page-item-1385");

      jQuery(".children .page-item-1398").insertAfter(".children .page-item-1349");
       jQuery(".children .page-item-1321").insertAfter(".children .page-item-1304");
    jQuery(".children .page-item-1331").insertAfter(".children .page-item-1321");
    jQuery(".children .page-item-1342").insertAfter(".children .page-item-1331");

      jQuery(".children .page-item-1417").insertAfter(".children .page-item-1398");
       jQuery(".children .page-item-1411").insertAfter(".children .page-item-1403");

      jQuery(".children .page-item-1564").insertAfter(".children .page-item-1417");
      jQuery(".children .page-item-1584").insertAfter(".children .page-item-1564");


    jQuery(".side-nav .page-item-1766").insertAfter(".side-nav .page-item-1656");
    jQuery(".side-nav .page-item-1775").insertAfter(".side-nav .page-item-1766");
       jQuery(".children .page-item-1686").insertAfter(".children .page-item-1677");
       jQuery(".children .page-item-1694").insertAfter(".children .page-item-1686");
       jQuery(".children .page-item-1699").insertAfter(".children .page-item-1694");

      jQuery(".children .page-item-1710").insertAfter(".children .page-item-1670");
       jQuery(".children .page-item-1726").insertAfter(".children .page-item-1723");
       jQuery(".children .page-item-1728").insertAfter(".children .page-item-1726");

      jQuery(".children .page-item-1739").insertAfter(".children .page-item-1710");




    jQuery(".side-nav .page-item-1847").insertAfter(".side-nav .page-item-1775");
      jQuery(".children .page-item-1840").insertAfter(".children .page-item-1815");

    jQuery("#nav_menu-3").remove();

Read More

Tạo Menu theo hàng ngang bằng html và css

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style type="text/css">
        p, ul, li, div, nav { padding:0; margin:0; } body { font-family:Roboto; } 
        #menu { overflow: auto; position:relative; z-index:2; } 
        .parent-menu { background-color: #ffffff; min-width:200px; float:left; } 
        #menu ul { list-style-type:none; } 
        #menu ul li a { padding:10px 15px; display:block; color:#000000; text-decoration:none; } 
        #menu ul li a:hover { background-color:#35baf2; }
        #menu ul li:hover > ul { left: 200px; -webkit-transition: left 200ms ease-in; -moz-transition: left 200ms ease-in; -ms-transition: left 200ms ease-in; transition: left 200ms ease-in; } 
        #menu ul li > ul { position: absolute; background-color: #35baf2; top: 0; left: -200px; min-width: 200px; z-index: -1; height: 100%; -webkit-transition: left 200ms ease-in; -moz-transition: left 200ms ease-in; -ms-transition: left 200ms ease-in; transition: left 200ms ease-in; } 
        #menu ul li > ul li a:hover { background-color:#2e2e2e; }


  </style>
</head>
<body>
  <nav id="menu">
<ul class="parent-menu">
<li><a href="#">Máy Lọc Nước Gia Đình</a>
<ul>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul>
</li>
<li><a href="#">Máy Lọc Nước Nhập Khẩu</a>
<ul>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul></li>
<li><a href="#">Máy Lọc Nước Nano</a>
<ul>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul></li>
<li><a href="#">Máy Lọc Nước RO</a>
<ul>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul>
</li>
<li><a href="#">Máy Lọc Nước Giếng</a>
<ul>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul>
</li>
<li><a href="#">Máy Lọc Nước Văn Phòng</a>
<ul>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul>
</li>
</ul>
</nav>


</body>
</html>

Read More

Tạo hiệu ứng FAQ câu hỏi thường gặp bằng js, css, html

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>
<a href="#" onclick="toggle_visibility('foo');">Click here to toggle visibility of element #foo</a>
<br />
<div id="foo" style="display: none;">
This is foo</div>

Read More

Ẩn text rồi thay thế bằng CSS

Cách 1:

.fusion-secondary-header .fusion-mobile-selector::after {
    content: 'Login';
    padding-left:5px;
}
.fusion-secondary-header .fusion-mobile-selector span {
    display: none;
}
.fusion-secondary-main-menu .fusion-mobile-selector::after {
    content: 'Menu';
    padding-left:5px;
}
.fusion-secondary-main-menu .fusion-mobile-selector span {
    display: none;
}

---

Cách 2:

#toplevel_page_ab-system .wp-menu-name {
  text-indent: -9999px;
  line-height: 0; /* Collapse the original line */
}

#toplevel_page_ab-system .wp-menu-name::after {
  content: "Appointments";
  text-indent: 0;
  display: block;
  line-height: initial; /* New content takes up original line height */
}

Read More