- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库?
- java - OnItemClickListener 不起作用,但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
每当单击“菜单”图标时,我都试图让菜单滑入。现在我看不出哪里错了。我在控制台中收到“菜单未定义”错误。
<!DOCTYPE html>
<html>
<head>
<title>Menu rechts</title>
<link href="style.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>
<section class="web_wrapper">
<header>
<main style="width: 100%;">
<button class="material-icons" id="menu_toggle" onclick="menu()">menu</button>
</main>
</header>
</section>
<section class="menu_show">
<nav style="right: -20%;">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
<nav>
</section>
<script src"toggle.js" type="text/javascript"></script>
</body>
</html>
使用的javascript
function menu()
{
var menu = document.querySelector("nav");
var main = document.querySelector("main");
if(menu.style.right != '-20%')
{
menu.style.right='-20%';
main.style.width='100%';
}
else
{
menu.style.right='0%';
main.style.width='80%';
}
}
CSS收到评论后,这似乎是一个 css 问题。由于这个原因,我也发布了 CSS。
* {
font-size: 12pt;
padding: 0px;
margin: 0px;
outline: 0;
border: 0; }
body {
width: 100%;
color: #212121; }
a {
text-decoration: none; }
li {
list-style-type: none; }
.web_wrapper {
float: left;
width: 100%;
height: auto; }
header {
width: 100%;
height: 100%; }
header main {
height: 75px; }
header main button#menu_toggle.material-icons {
position: relative;
top: 50px;
left: 1000px;
background: transparent;
transition: transform 0.3s, color 0.3s;
font-size: 24pt !important; }
header main button.active {
transform: rotate(90deg);
color: #536DFE; }
.menu_show {
height: 100vh;
float: right;
background: #607D8B; }
.menu_show nav {
width: 20%; }
.menu_show nav ul {
width: 100%; }
.menu_show nav ul li {
width: 100%;
text-align: center; }
最佳答案
试试下面的,
您可以简单地使用 jQuery animate
函数将其归档
阅读此 animate
var click = 0; //keep this flag to identify the click
function menu() {
var menu = $("nav");
$(menu).animate({
width: 'toggle'
},"slow","easeOutElastic");
if (click == 0) {
$(".web_wrapper").animate({"width": "100%"},"slow","easeOutElastic");
click = 1;
} else {
$(".web_wrapper").animate({"width": "80%"},"slow","easeOutElastic");
click = 0;
}
console.log(click);
}
nav {
color: 'black';
background-color: #ddd;
text-align: justify;
width: 20%;
float: right;
margin-top: -20px;
}
.web_wrapper {
width: 80%;
background-color: red
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<section class="web_wrapper">
<header>
<div style="width: 100%;" id="main">
<button class="material-icons" id="menu_toggle" onclick="menu();">menu</button>
</div>
</header>
</section>
<section class="menu_show">
<nav style="right:-20%;" id="nav">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</nav>
</section>
关于javascript - Onclick 没有被注册,一直告诉我它是未定义的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32933267/
我有一个问题,想知道如何在已经使用常规登录/注册系统的网站上集成第 3 方登录(也进行静默注册)。 基本上当前登录还是比较规律的: 当用户进入网站 session 时类(class)决定他是否需要重新
我在学习 Hyperledger Fabric 并运行示例代码。 我仍在尝试正确了解事情的运作方式,尤其是在使用证书和加密 Material 的用户/管理员注册和注册中。 我想知道以下如何工作。 1)
我正在尝试使用从我的 Android 设备的 PassWallet 应用程序中保存的票证中获取的 token 向我的设备发送消息。 设备发送使用苹果钱包规范更新通行证所需的所有信息。但是,我正在使用
使用 Passport 本地示例,我可以登录工作。没有关于如何注册用户的文档。 我想为用户提供一个“电子邮件”和“密码”字段,他们可以使用它们来注册该网站。我怎样才能做到这一点?有什么原因没有记录下来
在之前的一些 WSO2IS 版本中,有一个默认的 self 注册功能。但是,我在 5.0 版本中找不到它。 阅读 WSO2IS 5.0 文档,我发现有 2 个用于此功能的 API: getUserId
我已将 Airship SDK 集成到 Android 应用程序中。在应用程序启动和飞艇起飞后,我在日志中得到以下调试信息: 07-27 12:46:31.916 XXX - UALib( 1545)
Delphi 中设计时包的可怕错误之一是以下错误,这意味着注册安装新组件到您的 Palette 上的包: Component TSomething can't be registered by pac
我发现的大部分内容都使用 php 或类似的东西。 我有一个 Angular 前端和 Node/express 服务器代码。还没有后端。我不确定如何继续用户注册。 最佳答案 在没有后端的情况下进行注册等
我正在使用 Drupal 6 开发一个网站。我正在使用我自己的主题,并且一切正常。现在我需要使用我的自定义主题在我的网站上创建一个自定义登录/注册表单。我尝试了很多方法,但一切都重定向到我的管理主题,
我在运行此代码时收到 Sip 异常。这是因为 manager.register(me,20,listener)。 下面是我的代码,所以请帮我更正这段代码。我正在使用 SipDemo 代码注册我的帐户。
在过去的几天里,我一直在尝试为基于 VUE 的 excel 制作任务 Pane 插件。 我已按照 link 的指南进行操作我试图为 onSelectionChange 注册一个事件处理程序。它已经有些
我需要在使用 django-registration 应用程序的登录表单中实现一个“记住我”按钮。任何ane可以帮助我向我展示这样做的方法吗? 谢谢 最佳答案 一种方法是更改 session 到期
我发现,如果您使用 Django 1.5 版本,则 django 注册模块会中断,因为在最新的 django 开发版本中,simple.py 类已被删除。 最佳答案 此问题现已修复: hg clone
我正在尝试将 facebook connect 实现到我的网站,但有几个问题。 1:是否可以使用用户当前的 Facebook 电子邮件/密码在我的网站上注册用户。 假设用户点击链接通过 faceboo
我使用 Facebook 注册来允许人们在我的网站上注册。有没有可能,在注册后,他在我的网站注册的成员(member)墙上会张贴? 最佳答案 这可能不是您正在寻找的答案,但我强烈建议您不要这样做。用户
I would like to use a slash (/) for a search during a vimscript, but I don't want to overwrite the "
我正在使用 jqgrid 并且有显示日期的列,但是来自服务器的日期以 json 格式出现,如下所示, "CommentedDate": "\/Date(1304324941000+0530)\/" 如
我希望用户可以直接登录主页,而不是在“../account/login/”页面上登录。我应该做什么才能使它成为可能?如何将主页上的输入字段与 allauth 连接?我不知道这样是否太复杂而无法以这种方
This question already has answers here: Understanding NSString comparison (7个答案) 5年前关闭。 我正在尝试制作注册表。有
我正在使用 Django 注册。它提供了处理 registration_form.html 的 View ,该 html 当前包含用户名、密码 1、密码 2 和电子邮件作为我的应用程序中的用户可输入字
我是一名优秀的程序员,十分优秀!