关于中午去哪吃饭的CSS+JS的简单应用!

2024-01-06 07:38

本文主要是介绍关于中午去哪吃饭的CSS+JS的简单应用!,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>关于中午去哪吃饭的CSS+JS的简单应用!</title>
<script language="javascript">
var alldata = "这里修改,喜欢吃饭的地方,新中关,欧美汇,避风塘,牛魔王,小豆,即品面饭" //在本行修改吃饭地点
var alldataarr = alldata.split(",")
var num = alldataarr.length-1
var timer
function change(){
document.getElementById("oknum").value = alldataarr[GetRnd(0,num)];
}
function start(){
clearInterval(timer);
timer = setInterval('change()',30);
}
function ok(){
clearInterval(timer);
}
function GetRnd(min,max){
return parseInt(Math.random()*(max-min+1));
}
document.οnkeydοwn=key
function key(e) {
var e=e||event;
if (e.keyCode==83) start();
if (e.keyCode==79) ok();
}
</script>
<style>
.button { -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); -webkit-transition: all 0.1s ease; -moz-transition: all 0.1s ease; -o-transition: all 0.1s ease; font-family: "myriad-pro-1","myriad-pro-2"; line-height: 1.4; background-color: #49a7f3; display: inline-block; padding: 12px 20px; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; color: white; text-decoration: none; border: none; font-size: 22px; font-weight: bold; outline:0;}
.button:hover { background-color: #82c7ff;outline:0; cursor: pointer}
.button:active { -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.6); -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.6);outline:0;}
.choose { background-color: #41d05f; padding:8px 16px;width:230px;}
.choose:hover { background-color: #41d05f; cursor: help}
button::-moz-focus-inner{border-color:transparent!important;}
span{font-size:12px; float:right; color:#333;font-family:Verdana, Arial, Helvetica, sans-serif;}
span a{color:#333;text-decoration: none;}
</style>
</head>
<body>
<p>
<input type="text" id="oknum" name="oknum" value="去哪吃呢?" class="button choose">
</p>
<p>
<button οnclick="start()" accesskey="s" class="button">开始选地(<U>S</U>)</button> <button οnclick="ok()" accesskey="o" class="button">停(<U>O</U>)</button>
</p>
<span>code by <a href="http://uicss.cn/">cuikai-CSS库吧转载自崔凯的博客</a></span>
</body>
</html>

这篇关于关于中午去哪吃饭的CSS+JS的简单应用!的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/575661

相关文章

一份LLM资源清单围观技术大佬的日常;手把手教你在美国搭建「百万卡」AI数据中心;为啥大模型做不好简单的数学计算? | ShowMeAI日报

👀日报&周刊合集 | 🎡ShowMeAI官网 | 🧡 点赞关注评论拜托啦! 1. 为啥大模型做不好简单的数学计算?从大模型高考数学成绩不及格说起 司南评测体系 OpenCompass 选取 7 个大模型 (6 个开源模型+ GPT-4o),组织参与了 2024 年高考「新课标I卷」的语文、数学、英语考试,然后由经验丰富的判卷老师评判得分。 结果如上图所

vue, 左右布局宽,可拖动改变

1:建立一个draggableMixin.js  混入的方式使用 2:代码如下draggableMixin.js  export default {data() {return {leftWidth: 330,isDragging: false,startX: 0,startWidth: 0,};},methods: {startDragging(e) {this.isDragging = tr

亮相WOT全球技术创新大会,揭秘火山引擎边缘容器技术在泛CDN场景的应用与实践

2024年6月21日-22日,51CTO“WOT全球技术创新大会2024”在北京举办。火山引擎边缘计算架构师李志明受邀参与,以“边缘容器技术在泛CDN场景的应用和实践”为主题,与多位行业资深专家,共同探讨泛CDN行业技术架构以及云原生与边缘计算的发展和展望。 火山引擎边缘计算架构师李志明表示:为更好地解决传统泛CDN类业务运行中的问题,火山引擎边缘容器团队参考行业做法,结合实践经验,打造火山

vue项目集成CanvasEditor实现Word在线编辑器

CanvasEditor实现Word在线编辑器 官网文档:https://hufe.club/canvas-editor-docs/guide/schema.html 源码地址:https://github.com/Hufe921/canvas-editor 前提声明: 由于CanvasEditor目前不支持vue、react 等框架开箱即用版,所以需要我们去Git下载源码,拿到其中两个主

React+TS前台项目实战(十七)-- 全局常用组件Dropdown封装

文章目录 前言Dropdown组件1. 功能分析2. 代码+详细注释3. 使用方式4. 效果展示 总结 前言 今天这篇主要讲全局Dropdown组件封装,可根据UI设计师要求自定义修改。 Dropdown组件 1. 功能分析 (1)通过position属性,可以控制下拉选项的位置 (2)通过传入width属性, 可以自定义下拉选项的宽度 (3)通过传入classN

回调的简单理解

之前一直不太明白回调的用法,现在简单的理解下 就按这张slidingmenu来说,主界面为Activity界面,而旁边的菜单为fragment界面。1.现在通过主界面的slidingmenu按钮来点开旁边的菜单功能并且选中”区县“选项(到这里就可以理解为A类调用B类里面的c方法)。2.通过触发“区县”的选项使得主界面跳转到“区县”相关的新闻列表界面中(到这里就可以理解为B类调用A类中的d方法

js+css二级导航

效果 <!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-equiv="Con

基于Springboot + vue 的抗疫物质管理系统的设计与实现

目录 📚 前言 📑摘要 📑系统流程 📚 系统架构设计 📚 数据库设计 📚 系统功能的具体实现    💬 系统登录注册 系统登录 登录界面   用户添加  💬 抗疫列表展示模块     区域信息管理 添加物资详情 抗疫物资列表展示 抗疫物资申请 抗疫物资审核 ✒️ 源码实现 💖 源码获取 😁 联系方式 📚 前言 📑博客主页:

自制的浏览器主页,可以是最简单的桌面应用,可以把它当成备忘录桌面应用

自制的浏览器主页,可以是最简单的桌面应用,可以把它当成备忘录桌面应用。如果你看不懂,请留言。 完整代码: <!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><ti

vue+el国际化-东抄西鉴组合拳

vue-i18n 国际化参考 https://blog.csdn.net/zuorishu/article/details/81708585 说得比较详细。 另外做点补充,比如这里cn下的可以以项目模块加公共模块来细分。 import zhLocale from 'element-ui/lib/locale/lang/zh-CN' //引入element语言包const cn = {mess