<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title></title>

         <style>

             * {

                 margin: 0;

                 padding: 0;

                 border: none;

             }

             ul, li {

                 list-style: none;

             }

             body{

                 background: #ccc;

             }

             #box {

                 width: 150px;

                 height: 20px;

                 border: 1px solid white;

                 cursor: pointer;

             }

             #list {

                 width: 100px;

                 height: 150px;

                 background: black;

                 border: 1px solid white;

                 color: white;

                 display: none;

             }

             #list li{

                 border-bottom: 1px dashed white;

                 height: 29px;

                 line-height: 29px;

                 text-align: center;

                 cursor: pointer;

             }

         </style>

     </head>

     <body>

         <div id="box">请选择游戏名称</div>

         <ul id = "list">

             <li>英雄联盟</li>

             <li>魔兽世界</li>

             <li>大话西游</li>

             <li>天龙八部</li>

             <li>九阴真经</li>

         </ul>

         <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

         <script type="text/javascript">

             $(function () {

                 $("#box, #list").mouseenter(function () {

                     $("#list").show();

                 });

                 $("#box, #list").mouseleave(function () {

                     $("#list").hide();

                 });

                 $("#list li").mouseenter(function () {

                     $(this).css("background", "gray");

                 });

                 $("#list li").mouseleave(function () {

                     $(this).css("background", "black");

                 });

                 $("#list li").click(function(){

                     $("#box").html($(this).html());

                 })

             })

         </script>

     </body>

 </html>

jq-demo-点击选择（英雄联盟）的更多相关文章

  1. jq demo 点击弹窗，居中，可滚动，可拖动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jq demo 点击评分组件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jq demo 点击选中元素左右移动

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  4. (转，感谢原作者！)既然选择了Linux,有何必在乎这些——Linux wine国服LOL英雄联盟，完美运行！！

    Linux下玩国服LOL,国服哦.网络上随处都可以搜到wine美服LOL的教程,但腾讯运营的国服客户端跟美服原版相差比较大,按照美服的方式不能搞起国服LOL,由于宿舍文化,这几天我专注于wine一个国 ...

  5. Android仿掌上英雄联盟首页，实现折叠效果

    概述 仿掌上英雄联盟首页的demo 详细 代码下载:http://www.demodashi.com/demo/10695.html 首页大概分为几个部分 状态栏 标题栏 轮播图 切换的Tab 资讯列 ...

  6. c# WinForm英雄联盟挂机源码及实现原理

    主要功能:全自动化英雄联盟挂机,游戏中会在原地放技能保持不掉线状态,游戏结束自动重新开始,自动选择英雄,可以晚上挂机刷人机: 缺陷:没怎么完善,如果掉线或者游戏崩溃网络断了软件会自动停止操作,使用时间 ...

  7. 用Python爬取英雄联盟（lol）全部皮肤

    小三:"怎么了小二?一副无精打采的样子!" 小二:"唉!别提了,还不是最近又接触了一个叫英雄联盟的游戏,游戏中很多皮肤都需要花钱买,但是我钱不够呀..." 小三 ...

  8. python爬虫——《英雄联盟》英雄及皮肤图片

    还记得那些年一起网吧开黑通宵的日子吗?<英雄联盟>绝对是大学时期的风靡游戏,即使毕业多年的大学同学相聚,难免不怀念一番当时一起玩<英雄联盟>的日子. 今天就给大家分享一下英雄及 ...

  9. 用Python抓取并分析了1982场英雄联盟数据，教你开局前预测游戏对局胜负！

    英雄联盟想必大多数读者不会陌生,这是一款来自拳头,由腾讯代理的大型网络游戏,现在一进网吧,你就能发现一大片玩英雄联盟的人.在2017年中国战队无缘鸟巢的世界总决赛后,一大片人选择了弃游,只是终究没躲过 ...

随机推荐

  1. phpstorm提示phalcon语法

    先安装phalcon,将phalcon的扩展php_phalcon.dll添加到PHP的ext目录下,这个不做赘述,网上教程很多 下面直接安装phalcon-devtools, 1,分别下载phalc ...

  2. Android开发 Butterknife使用方法总结

    前言: ButterKnife是一个专注于Android系统的View注入框架,以前总是要写很多findViewById来找到View对象,有了ButterKnife可以很轻松的省去这些步骤.是大神J ...

  3. OpenGL学习——绘制矩形

    接下来稍微扩展一步,绘制矩形,即两个拼在一起的三角形. 引入一个概念, EBO Element Buffer Object  元素缓冲对象, EBO用于存放描述“顶点绘制顺序”的对象. 外注:创建VS ...

  4. Linux中目录结构以及VI编辑器常见的命令操作

    1.每个目录的详细介绍,先放一张目录的整体结构在这里 /bin:是Binary的缩写,用于存放经常使用的命令 /sbin:s代表Super User,用于存放系统管理员使用的命令 /home:存放普通 ...

  5. logging模板

    logging模板是一个专门用来做日至系统的 缺点是不能指定编码格式 import logging#引入logging板块 logging.basicConfig(#这个日志的基本配置 level=, ...

  6. position: absolute 如果不设置left, right, top, bottom会在什么位置

    一般我们设置position: absolute都会一起设置left/right/top/bottom, 但是如果不设置, 布局会是什么样子的呢? 直接上图 1.一个大盒子中4个小盒子, 正常文档流布 ...

  7. leetcode-160周赛-5241-铺瓷砖

    题目描述: 方法一:动态规划 class Solution: def f(self, n, m): if n < m: n, m = m, n if (n, m) in self.mem: re ...

  8. WPF ListBox 横向排列

    WPF ListBox 横向排列   如果只是单纯的让ListBox可以横向配列,这样很简单,只需要更改ListBox的ItemsPanel模板就可以,例如: <ListBox><L ...

  9. elementUI拿到当前表格行的数据的另一种写法

    背景: 这里是通过点击“修改”按钮后才拿到当前行的数据,不是点击当前行任意位置拿到数据,所以不能用 @row-click 方法 改用点击的时候直接拿到这个表里面的这一条数据 1.绑定事件 <te ...

  10. (12)centos7 环境变量配置

    export 一个变量的设置一般只在当前环境有效,export命令可以用于传递一个或多个变量的值到任何后续脚本.export可新增.修改或删除环境变量,供后续执行的程序使用.export的效力限于该次 ...