移动设备不要判断js文件，只要PC设备判断js文件，该怎么做的？
PC端判断鼠标滚动放大缩小导航栏代码，但移动设备都不要有菜单导航放大缩小的特效。
如何不让手机有菜单放大缩小的特效？请高手能来帮忙，真的感激不已！
是放大缩小导航的js代码：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>天文网站</title>
<meta charset="utf-8">
<style>
* { margin: 0; padding: 0;}
.menu .header { position: fixed; left: 0; top: 0; width: 100%; background-color: #323436;}
.menu .inner { width: 1000px; margin: 0 auto; overflow: hidden; zoom: 1;}
.menu h1 { float: left;}
.menu h1 img { display: block; border: 0;}
.menu .nav { float: right; list-style-type: none; font-family: "Microsoft Yahei";}
.menu .nav li { float: left; margin-left: 5px;}
.menu .nav a { float: left; color: #cecece; text-decoration: none;}
.menu .nav a:hover { background-color: #555;}
.menu .large .inner { padding: 20px 0;}
.menu .large h1 img { height: 64px;}
.menu .large .nav { padding-top: 10px;}
.menu .large .nav a { height: 44px; padding: 0 20px; line-height: 44px; font-size: 18px;}
.menu .small .inner { padding: 10px 0;}
.menu .small h1 img { height: 34px;}
.menu .small .nav { padding-top: 3px;}
.menu .small .nav a { height: 28px; padding: 0 10px; line-height: 28px; font-size: 14px;}
.menu .header, .menu .inner, .menu a, .menu img, .menu li { transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s;}
</style>
</head>
<body class="menu">
<div class="header large">
<div class="inner">
<h1><a href="http://www.mycodes.net/"><img src="images/logo.png" alt="logo"></a></h1>
<ul class="nav">
<li><a class="cur" href="" title="">首页</a></li>
<li><a href="" title="">摄影</a></li>
<li><a href="" title="">软件</a></li>
<li><a href="" title="">天文</a></li>
</ul>
</div>
</div>
<script src="js/jquery.min.js"></script>
// 放大缩小的特效
<script>
$(function(){
$(window).on('scroll', function(){
if($(window).scrollTop() > 100){
$('.header').removeClass('large').addClass('small');
} else {
$('.header').removeClass('small').addClass('large');
}
});
});
</script>
</body>
</html>
例如
诺幻SAMA
9 years, 4 months ago
Answers
判断浏览器ua，然后根据ua来判断要不要这部分代码。
var pc,ua;
/*根据ua的情况来判断`pc`的值*/
if(pc){
$(window).on('scroll', function(){
if($(window).scrollTop() > 100){
$('.header').removeClass('large').addClass('small');
} else {
$('.header').removeClass('small').addClass('large');
}
});
}
Fishhy
answered 9 years, 4 months ago
