<!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. mac 创建多个全局Path

    cd ~ 进入根目录 (没有这个文件 先touch .bash_profile) open -e .bash_profile 打开编辑然后保存 JAVA_HOME=/Library/Java/Java ...

  2. linux网络配置 转

    1.常用配置网络指令 (1) 配置eth0的IP地址, 同时激活该设备 1 sudo ifconfig eth0 192.168.1.10 netmask 255.255.255.0 up (2) 添 ...

  3. 【CSS3】rgba与opacity

    RGBA 语法 R:红色值.正整数 | 百分数 G:绿色值.正整数 | 百分数 B:蓝色值.正整数| 百分数 A:透明度.取值0~1之间 为什么要用RGBA而不用opacity 因为在项目中需要用到一 ...

  4. NDK笔记（二）-在Android Studio中使用ndk-build（转）

    前面一篇我们接触了CMake,这一篇写写关于ndk-build的使用过程.刚刚用到,想到哪儿写哪儿. 环境背景 Android开发IDE版本:AndroidStudio 2.2以上版本(目前已经升级到 ...

  5. nodejs模块——fs模块 读取文件

    readFile读取文件 fs.readFile(filename,[option],callback) 方法读取文件. 参数说明: filename String 文件名 option Object ...

  6. 【JZOJ3920】噪音

    description FJ有M个牛棚,编号1至M,刚开始所有牛棚都是空的.FJ有N头牛,编号1至N,这N头牛按照编号从小到大依次排队走进牛棚,每一天只有一头奶牛走进牛棚.第i头奶牛选择走进第p[i] ...

  7. springcloud笔记一

    微服务的概述 什么是微服务? 现今微服务界没有一个统一的.标准的定义 微服务化的核心就是将统一的一站式应用,根据业务拆分成一个一个的服务,彻底的去耦合,每一个微服务提供单个业务功能的服务,一个服务做一 ...

  8. Android中.9图片的了解和制作过程

    个部分(九宫格),分别为4个角,4条边,以及一个中间区域,4个角是不做拉升的,所以还能一直保持圆角的清晰状态,而2条水平边和垂直边分别只做水平和垂直拉伸,所以不会出现边会被拉粗的情况,只有中间用黑线指 ...

  9. Python 爬取各大代理IP网站(元类封装)

    import requests from pyquery import PyQuery as pq base_headers = { 'User-Agent': 'Mozilla/5.0 (Windo ...

  10. Ext 面板（Panel）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...