Mobile Detect

by Dennis Betman

HTML

<div class="mobile_wrapper">
     <h3>Dit is een test die moet veranderen</h3>

    <div class="menu">
        <ul>
            <li>hallo</li>
            <li>Sukkel</li>
            <li>HAHAH</li>
        </ul>
    </div>
</div>
<button>Go Change</button>

<!-- 
    var isMobile = { 
        Android: function() { return navigator.userAgent.match(/Android/i); }, 
        BlackBerry: function() { return navigator.userAgent.match(/BlackBerry|BB10/i); }, 
        iOS: function() { return navigator.userAgent.match(/iPhone|iPod/i); }, 
        Opera: function() { return navigator.userAgent.match(/Opera Mini/i); }, 
        Windows: function() { return navigator.userAgent.match(/IEMobile/i); }, 
        any: function() { return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows()); } 
    };

    $(document).ready(function(){
        if (!isMobile.any())
        alert("no");
        if (isMobile.any())
        alert
-->

CSS

.mobile {
    width:375px;
    height:500px;
    border:1px solid #d3d3d3;
    margin:0px auto;
}

JavaScript

$("button").click(function () {
    changeMenu = function (wrapper) {
        var heden = wrapper.length;
        var getIdClass = wrapper.substring(0,1);
        var getName = wrapper.substring(1,heden)
        
        if(getIdClass == "#"){
            var attr = "id";
        }
        else if(getIdClass == "."){
            var attr = "class";
        }
        
        var log = "<div "+attr+"='"+getName+"'></div>";
        alert(log);
    };

    changeMenu("#menu");
});