Auto Wap/Web

1. Auto Wap Web bằng javascript theo độ rộng màn hình

Cách dùng: thay đổi giá trị w>=1000. Ví dụ bạn muốn những màn hình có độ rộng lớn hơn 1000px sẽ hiển thị code cho web thì bạn bọc xung quanh những code mà bạn muốn hiển thị bằng class web 
Ví dụ 
<div class="web">những code bạn muốn web hiển thị</a>
<div class="wap">những code bạn muốn wap hiển thị</a>

Coppy js bên dưới dán vào head hoặc top của trang wapka bạn

Code

<script type="text/javascript"> var w=window.innerWidth; if(w>=1000){document.write('<style type="text/css">.wap{display:none;}</style>');} else{document.write('<style type="text/css">.web{display:none;}</style>');}</script>

3. Auto Wap Web bằng javascript nhận diện trình duyệt

Dán vào Head hoặc top

Code

<script type="text/javascript">{document.write("<script type="text/javascript">if("+navigator.appName+"=="Internet exeroler"|| "+navigator.appName+"=="Mozilla Firefox" ||"+navigator.appName+"=="Google Chrome"||"+navigator.appName+"=="Opera"||"+navigator.appName+"=="Sarafi"){document.write("link css dành cho pc");}else{document.write("link css cho điện thoại");}</script><noscript>link css cho dòng không hỗ trợ javascript</noscript>")};</script>

4. Auto Wap Web bằng CSS (Reponsive)

Cái này cũng không mới hiện nay đang rất thịnh hành (Hãy tìm hiểu khái niệm Reponsive CSS)

CSS này sẽ có tác dụng tương tự như số 1 là theo độ rộng màn hình. Lợi ích sẽ tăng khả năng load trang và tương thích trên nhiều thiết bị. Hơn nữa loại này các bạn có thể tùy chỉnh css ở nhiều độ rộng khác nhau với nhiều dạng css khác nhau

Dưới đây là đoạn css giúp reponsive

@media only screen and (min-width: 1024px) {
    /* CSS cho máy tính */
    .css1 {}
    .css2 {}
}
@media only screen and (min-width: 768px) {
    /* CSS cho máy tính bảng */
    .css1 {}
    .css2 {}
}

@media only screen and (max-width: 768px) {
    /* CSS cho di động */
    .css1 {}
    .css2 {}
}

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