bootstrap使用汇总
//大多数功能都能够指定data属性来指定 但是,有必要的情况下使用jquery由于事件是不同的过程
//活动通常有两种状态show shown 通用和过去的
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet" media="screen">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
//通过编写jquery 来展示效果,方法和事件的使用
//$("#myModal").modal({show:true,backdrop:true});
$('#myModal').on('shown', function () {
alert("hahjah");
})
});
</script>
</head>
<body>
//通过data属性来查看效果
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">查看演示案例</a>
//指定data属性data-backdrop backdrop是一个可选參数。能够看文档还有非常多实用的属性
<button type="button" data-backdrop="false" data-toggle="modal" data-target="#myModal">Launch modal</button>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
<p>假设您点击我。我会消失。</p>
<!--***************************************************************************-->
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
版权声明:本文博主原创文章。博客,未经同意不得转载。
bootstrap使用汇总的更多相关文章
- GitHub托管BootStrap资源汇总(持续更新中…)
Twitter BootStrap已经火过大江南北,对于无法依赖美工的程序员来说,这一成熟前卫的前端框架简直就一神器,轻轻松松地实现出专业的UI效果.GitHub上相关的的开源项目更是层出不穷,在此整 ...
- GitHub托管BootStrap资源汇总
MESSENGER替换alert()消息和其他用户交互通知. JQUERY.TOCIFY.JS可以用Bootstrap或jQueryUI主题的Jquery表格组件. BOOTSTRAP-PROMPTS ...
- Bootstrap后台使用问题汇总(一)
第一次自己汇总写博客啊,不懂规矩,大家包涵~~ 最近进行的项目中需要一个后台,于是在网上Down了许多Bootstrap后台源码.精挑细选决定用“ACE后台管理系统”(因为是中文的,英文三级狗的小鹿还 ...
- ***Bootstrap FileInput插件的使用经验汇总
插件下载地址: https://github.com/kartik-v/bootstrap-fileinput/ 官方DEMO查看: http://plugins.krajee.com/file-ba ...
- 基于bootstrap的漂亮网站后台管理界面框架汇总
基于bootstrap的漂亮网站后台管理界面框架汇总 10个最新的 Bootstrap 3 管理模板 这里分享的 10 个模板是从最新的 Bootstrap 3 管理模板集合中挑选出来的,可以帮助你用 ...
- Bootstrap 常用组件汇总
Bootstrap 官方文档:http://www.bootcss.com/ Bootstrap Multiselect 多选下拉组件 官方文档:http://www.kuitao8.com/demo ...
- bootStrap table 和 JS 开发过程中遇到问题汇总
1..bootStrap-table表头固定 在table定义的时候给高度属性就可以自动生成滚动条,并且固定表头[height: 220,] 2.为动态生成的DOM元素绑定事件 on("cl ...
- Bootstrap table分页问题汇总
首先非常感谢作者针对bootstrap table分页问题进行详细的整理,并分享给了大家,希望通过这篇文章可以帮助大家解决Bootstrap table分页的各种问题,谢谢大家的阅读. 问题1 :服务 ...
- bootstrap学习笔记--bootstrap安装环境
Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...
随机推荐
- 基于 Groovy 的自动化构建工具 Gradle 入门(转)
本人工作之初没有使用自动化构建,后来敏捷了,开始使用 Ant - 完全面向过程的定义步骤,不进行依赖管理.再发展到 Maven,面向对象的方式管理工程,有了依赖的管理,JAR 包统一从中央仓库获得,保 ...
- Ubuntu12.04下载Repo
操作系统:Ubuntu12.04LTS 64bit "#"号后面表示凝视内容 $cd ~ #进入下载文件夹 $mkdir bin #创建bin文件夹用于存储Repo脚本 $PATH ...
- Mina框架断包、粘包问题解决方式
Mina框架断包.粘包问题解决方式 Apache Mina Server 是一个网络通信应用框架,也就是说,它主要是对基于TCP/IP.UDP/IP协议栈的通信框架(当然.也能够提供JAVA 对象的序 ...
- mini2440裸试验—计算器(LCD显示,触摸屏突破)
关于Pait_Bmp(x0, y0, x, y, BMPaddr);函数 像素图在屏幕左上角为(0,0),Pait_Bmp中的x0.y0分别像素点初始位置,x,y为BMP图片的X,Y的大小.BMPad ...
- struts(二)——struts框架实现的基本原理
上一篇文章,我们介绍了MVC框架的基本原理,并指出了这个基本框架中存在大量if…else的问题.今天我们来介绍一下struts框架,让struts解决这个问题. 首先,看一下粗略的时序图: Actio ...
- POJ 1515 Street Directions
题意: 一幅无向图 将尽量多的无向边定向成有向边 使得图强连通 无向图保证是连通的且没有重边 思路: 桥必须是双向的 因此先求边双连通分量 并将桥保存在ans中 每一个双连通分量内的边一定都 ...
- 为什么不要在android或者ios上直连mysql或者sqlserver之类的数据库(跳大神)
很多同学 都有直连这些数据库的想法,假设我说了下面二个问题之后你还想直连,那我也没办法 数据库是一个服务端最重要的部分,也是最脆弱的部分,更是最敏感的部分 假设直连会造成例如以下问题 1.安全问题,你 ...
- 阿赫亚web安全JSON
前言 JSON(JavaScript Object Notation),可以说,这一事实,浏览器,server数据交换标准.的格式如XML,或者其他自己定义的格式会越来越少. 为什么JSON这么流行? ...
- UseCase事件描述叙事流规范
文化/fasiondog 整理的用例需求编写规范.分享部分UseCase事件描述叙事流规范.其中.标准5~10.12来自哪里<编写有效用例>([美国] Alistair Cockburn ...
- Maven和Gradle
Maven和Gradle对比 Java世界中主要有三大构建工具:Ant.Maven和Gradle.经过几年的发展,Ant几乎销声匿迹.Maven也日薄西山,而Gradle的发展则如日中天.笔者有幸见证 ...