gpt4 book ai didi

CSS 移动设备和汉堡菜单

转载 作者:行者123 更新时间:2023-11-28 03:07:07 27 4
gpt4 key购买 nike

我设计了一个网站,该网站使用 CSS 汉堡菜单来激活带有指向网站上不同网页的链接的滑动条。

我还编写了一个 iPhone/andriod 应用程序,它需要一个汉堡菜单来打开一个运行 swift 和 android 代码的 slider 工作。

我想添加到网站的 iphone/android 汉堡包 slider 链接(它有自己的汉堡包菜单)

我如何在网站上测试它是移动设备还是 PC,所以如果是移动设备,我可以关闭“网站”汉堡包,因为我已经拥有并且需要移动设备上的汉堡包菜单。

我的网站上有 php,所以如果是移动设备,我可以删除网站上的汉堡菜单。

这是主页面

<html>


<div class="w3-sidebar w3-bar-block w3-card-2 w3-animate-left" style="display:none" id="mySidebar">
<button class="w3-bar-item w3-button w3-large" onclick="w3_close()">Home</button>
<a href="menu_01_angular.php" class="w3-bar-item w3-button">Link 1</a>
<a href="#" class="w3-bar-item w3-button">Link 2</a>
<a href="#" class="w3-bar-item w3-button">Link 3</a>
</div>






<div zclass="w3-main" id="main">
<div class="w3-teal">
<button class="w3-button w3-teal w3-xlarge" onclick="w3_open()">&#9776;</button>
<div class="w3-container">
<h1>My Page</h1>
</div>

谢谢

最佳答案

所以有几种方法可以做到这一点,但一个非常简单的方法是这样的:

var width = $(window).width(); //jquery
var width = window.innerWidth; //javascript

if(width > 1000){do large screen width display)
else{handle small screen}

当然,1000 只是一个任意数字。这变得很棘手,因为当您考虑表格时,确实有各种尺寸的屏幕,因此由您决定什么属于哪里

关于CSS 移动设备和汉堡菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45897302/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com