ul li 切换 判断手机

$(function(){
       var spans= $("ul > li ").click(function(){
            $(this).parent().children().removeClass("tabs-selected");
            $(this).addClass("tabs-selected");
            })
        });
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
   <script type="text/javascript" src="WebContent/js/jquery.min.js"></script>
</head>

<body>
<p>Loading ...</p>
<form id="form1" name="form1" action="ShowLoginAction.do" method="post">
    <input type="hidden" id="type" name="type">
</form>
</body>
<script>
        var browsertype={
        versions:function(){
                var u = navigator.userAgent;
                return {
                    trident: u.indexOf(‘Trident‘) > -1, //IE内核
                    presto: u.indexOf(‘Presto‘) > -1, //opera内核
                    webKit: u.indexOf(‘AppleWebKit‘) > -1, //苹果、谷歌内核
                    gecko: u.indexOf(‘Gecko‘) > -1 && u.indexOf(‘KHTML‘) == -1, //火狐内核
                    mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否为移动终端
                    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
                    android: u.indexOf(‘Android‘) > -1 || u.indexOf(‘Linux‘) > -1, //android终端或者uc浏览器
                    iPhone: u.indexOf(‘iPhone‘) > -1, //是否为iPhone或者QQHD浏览器
                    mac:    u.indexOf(‘Mac‘) > -1,
                    iPad: u.indexOf(‘iPad‘) > -1, //是否iPad
                    webApp: u.indexOf(‘Safari‘) == -1 //是否web应该程序,没有头部与底部
                };
            }()
        };

        if((browsertype.versions.iPhone) || (browsertype.versions.android)){
            $("#type").val("mobile");
            //$("#type").val("pc");
            //location.href="ShowLoginAction.do?type=mobile";
        }else{
            $("#type").val("pc");
            //location.href="ShowLoginAction.do?type=pc";
        }
        $("#form1").submit();
</script>
</html>
时间: 2024-11-08 04:38:38

ul li 切换 判断手机的相关文章

静态html页面 ul+li模拟table,减少代码冗余,列数切换更方便

先直接上效果图: 二.帖代码 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Author" content="haley"> 6 <meta name="Keywords" content="表格"&

判断手机横竖屏

//判断手机横竖屏状态:window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() { if (window.orientation === 180 || window.orientation === 0) { //竖屏 } if (window.orientation === 90 || window.o

JS判断是否是微信页面,判断手机操作系统(ios或android)并跳转到不同下载页面

JS判断客户端是否是iOS或者Android 参考:http://caibaojian.com/browser-ios-or-android.html 1 function is_weixin() { 2 var ua = window.navigator.userAgent.toLowerCase(); 3 if (ua.match(/MicroMessenger/i) == 'micromessenger') { 4 return true; 5 } else { 6 return fals

[转载] ul li css 做横向菜单

原文地址: http://www.cnblogs.com/amylis_chen/archive/2011/09/24/2188398.html 第一步:建立一个无序列表 我们先建立一个无序列表,来建立菜单的结构.代码是: <ul> <li><a href="1">首页</a></li> <li><a href="2">产品介绍</a></li> <li

div+css(ul li)实现图片上文字下列表布局

css样式表代码: html布局代码: 效果图: html布局部分,可根据自己需要添加对应的div即可. 1.CSS关键样式单词解释 1).ul.imglist{ margin:0 auto; width:536px; overflow:hidden}使用margin:0 auto,让ul结构布局居中:使用overflow:hidden,因为ul的子级使用float属性会产生浮动,所以使用清除子级使用float对父级产生不能撑开问题:使用宽度width:536px;固定宽度让子级li准确一排只排

html ul li 显示数据库

方法1: function insert() { var str=""; var data="你的数据库数据"; str="<ul><li>"+data+"</ul></li>"; document.getElementById("test").innerHTML = str; } <body onload="insert()">

&lt;ul&gt;-&lt;li&gt;无序列表标签

概念:多个并列的列表项之间没有先后顺序 源码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http

用ul li做的menu怎么才能使整个li都是链接区域?

a 加上 display:block <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-e

CSS ul li a 背景图与文字对齐

<div class="four"> <h2>电子商务</h2> <img src="images/photo2.gif" /> <ul> <li><a href="#">方便的订单管理1</a></li> <li><a href="#">方便的订单管理2</a></li>