JqueryUI-1
本文在于巩固基础
学习网址：http://jqueryui.com/
基本概念：jQuery UI[是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库。包含底层用户交互、动画、特效和可更换主题的可视控件。我们可以直接用它来构建具有很好交互性的web应用程序。所有插件测试能兼容IE 6.0+, Firefox 3+, Safari 3.1+, Opera 9.6+, 和GoogleChrome。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>播放音乐</title>
<link rel="stylesheet" type="text/css" href="Css/myCss.css"/>
<link rel="stylesheet" type="text/css" href="Css/jquery-ui.min.css"> </head>
<body> <div id="sss">
<h1>音乐播放</h1>
<div id="music">
<button id="btn">播放/暂停</button>
<audio id="audio" src="Source/Happiness.mp3"></audio>
</div> </div>
<script src="Script/jquery-2.1.1.min.js"></script>
<script src="Script/jquery-ui.min.js"></script>
<script type="text/javascript" src="Script/myScript.js"></script>
</body>
</html
h1{
color: blue;
}
#music {
color: red;
}
#sss{
width: 200px;
height: 200px;
border: 2px solid red;
}
/**
* Created by Administrator on 2015/3/5 0005.
*/
$(document).ready(function(){
$("#sss").draggable(); $("#btn").click(function(){
if($("#audio").get().paused)
{
$("#audio").get().play();
}
else
{
$("#audio").get().pause();
}
}); });这样我们就可以去拖动这个div，而且能都点击其中的音乐播放暂停
JqueryUI-1的更多相关文章
- Jquery-UI使用
=创建form对话框弹出登录 首先引入css样式和js. <link rel="stylesheet" href="<%=path%>/css/demo ...
- jqueryUI弹出框问题
jqueryui dialog中 select选不中或比较慢 dialog = function(Window,dialogDivId,title,buttons,css) { css = css|| ...
- jQueryUI Draggable 和 Droppable 配合使用时遇到的两个坑
jQueryUI 的 拖拽插件极大的方便了开发者对拖拽功能的实现,但是官方教程给的太笼统,在具体实现的时候很多地方不明确,这里说一下我遇到的两个 "小坑": 1:Draggable ...
- jqueryui 进度条使用
<title></title> <script src="../Js/NewJs_CFJ/jquery.js" type="text/jav ...
- 用JqueryUI的Dialog+IFrame实现仿模态窗口效果
大家有没有想过这样一个问题,当我点击某个图片的时候,我想弹出这个图片信息的详情并修改,于是你首先想到的是不是window.open?window.open方法确实可以,但是有它的局限性,比如,标题显示 ...
- 解决JqueryUI 拖放排序遇到滚动条时有可能无法执行排序的小bug
前些日子不是在做 使用Jquery-UI实现一次拖拽多个选中的元素操作嘛,在持续完善这个组件时遇到了一个关于拖放排序的bug.今天就着图片和代码重现一下,也顺便告诉大家如何解决这个问题. 首先先上图描 ...
- 使用 Jquery-UI 实现一次拖拽多个选中的元素操作
项目需要,实现一个拖放操作,要求每次可以拖拽选中的多个元素,释放到目标容器后可排序.考虑了一下,觉得jquery-ui比较合适,毕竟它提供了项目需要的交互性事件机制.拖拽.释放.排序.选择等效果.而在 ...
- [原创]首次制作JQueryUI插件-Timeline时间轴
特点: 1. 支持多左右滚动,左右拖动. 2. 时间轴可上下两种显示方式. 3. 支持两种模式的平滑滚动/拖动. 4. 行压缩(后续版本此处可设置是否开启,上传的代码不带这个功能). 5. 支持hov ...
- Ajax与JqueryUI和EasyUI错题总结
Ajax与JqueryUI和EasyUI错题总结 正确答案A,解析:此题考察的是JQuery UI下的menu插件的使用,menu提供ui-state-disabled class 方法禁用任何菜单项 ...
- jqueryUI 插件
1,拖拽插件 draggable 拖拽插件draggable的功能是拖动被绑定的元素, 当这个jqueryUI插件与元素绑定后,可以通过调用draggable()方法,实现何种拖拽元素的效果 $(s ...
随机推荐
- Samsung K9F1G08U0D SLC NAND FLASH简介（待整理）
Samsung K9F1G08U0D,数据存储容量为128M,采用块页式存储管理.8个I/O引脚充当数据.地址.命令的复用端口.详细:http://www.linux-mtd.infradead.o ...
- The 2013 South America/Brazil Regional Contest 题解
A: UVALive 6525 cid=61196#problem/A" style="color:blue; text-decoration:none">Atta ...
- 擦肩而过的那块牌--记ACM_ICPC西安赛区现场赛
说了那么多次orz,这次是真的orz了.去了西安打区域赛,也想过会打铁.但当终于那一刻确定打铁了之后.心里还是非常不开心的,颁奖的时候思考熊那家伙嚣张的举起来手中那个金杯,说实话闪到我眼了(太亮了QA ...
- 【输入输出挂】【Uva11462】Age Sort
例题17 年龄排序(Age Sort, UVa 11462)照从小到大的顺序输出. [输入格式] 输入包含多组测试数据.每组数据的第一行为整数n(0<n≤2 000 000),即居民总数:下一 ...
- 美化select的jquery插件
自己写的一个美化select插件,浏览器自带的实在太丑,还不能用css自定义. 插件主要原理是隐藏原生的select控件,支持select上设置change事件. 脚本 /* * iSelect * ...
- SQL Server 2008 忘记sa密码的解决办法
由于某些原因,sa和windows验证都不能登录 sql server,可以用独占模式,修改sa密码先在服务管理器停止Sql Server服务,然后打开命令行,进入 SQL Server安装目录,进入 ...
- XMLHttpRequest Level 2 使用指南
XMLHttpRequest是一个浏览器接口,使得Javascript可以进行HTTP(S)通信. 最早,微软在IE 5引进了这个接口.因为它太有用,其他浏览器也模仿部署了,ajax操作因此得以诞生. ...
- WebService应用一例，带有安全验证
1.创建WEB项目,添加WEB服务WebService1.asmx,代码如下: using System; using System.Collections.Generic; using System ...
- Spring 注入数据源
一.在项目中添加dataSource所用到的包 dbcp数据源所需包: commons-dbcp.jar commons-pool.jar C3P0数据源所需包: c3p0-0 ...
- （转）（VS2013 ）由于应用程序配置不正确,程序未能启动”－－原因及解决方法
今天把别人的程序拿过来编译时通过,但是运行的时候,提示:由于应用程序配置不正确,程序未能启动 搜了一下,各种方法.最终通过下面的方法解决的. 项目--->配置属性---->链接器----& ...