随笔分类 - [10]JS
-
(JavaScript插件——下拉菜单)
摘要:前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要来学习一下JavaScript插件--下拉菜单。下拉菜单通过此插件可以为几乎所有东西添加下拉菜单,包括导航条、标签页、胶囊式按钮,本文主要来介绍下导航条里面的下拉菜单吧,其实道理都是一样的。用于导航条先来看一下之前做过的一个简单的导航条导航条分为四个部分。第一部分导航头,第二部分导航列,第三部分form查询表单,第四部分导航列。 Toggle navigation ... 阅读全文
-
JavaScript插件——模态框
摘要:Bootstrap3.0学习第十七轮(JavaScript插件——模态框)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要来学习一下JavaScipt插件模态框。在学习模态框之前,我们先来了解一下JavaScript插件吧。JavaScript插件概览插件可以单个引入(使用Bootstrap提供的单个*.js文件),或一次性全部引入(使用bootstrap.js或压缩版的bootstrap.min.js)。不要将两份文件全部引入bootstrap.js和bootstrap.m 阅读全文
-
require.js实践
摘要:ASP.NET MVC应用require.js实践这里有更好的阅读体验和及时的更新:http://pchou.info/javascript/asp.net/2013/11/10/527f6ec41d6ad.htmlRequire.js是一个支持javascript模块化编程的类库,不了解的读者请移步至:Javascript模块化编程(三):require.js的用法。require在单页面应用中能够如鱼得水,然而对于传统的多页面应用,使用require多少会有些困惑和不方便。多页面应用的一个典型的例子是https://github.com/requirejs/example-multipag 阅读全文
-
Bootstrap3.0(进度条、媒体对象、列表组、面板)
摘要:Bootstrap3.0学习第十六轮(进度条、媒体对象、列表组、面板)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要来讲解以下内容1.进度条2.媒体对象3.列表组4.面板5.总结进度条提供工作或动作的实时反馈,只用简单且灵活的进度条。跨浏览器兼容性进度条使用了CSS3的transition和animation属性来完成一些效果。这些特性在Internet Explorer 9或以下版本中、Firefox的老版本中没有被支持。Opera 12不支持znimation属性。基本 阅读全文
-
Bootstrap3.0学习第十五轮(大屏幕介绍、页面标题、缩略图、警示框、Well)
摘要:Bootstrap3.0学习第十五轮(大屏幕介绍、页面标题、缩略图、警示框、Well)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要来讲解以下内容1.大屏幕介绍2.页面标题3.缩略图4.警示框5.Well6.总结大屏幕介绍轻量,灵活的可选组件,扩展整个视角,展示您站点上的关键内容。要让大屏幕介绍是屏幕宽度,请别把它包括在.container。 Hello, world! This is a simple hero unit, a simple jumbotron-sty.. 阅读全文
-
jQuery的入门与简介
摘要:jQuery的入门与简介《思维导图》《初学者请各位高手指点指点》jQuery是继Prototype之后又一个优秀的JavaScript库,在JavaScript基础上我知道了jQuery拥有强大的选择器,出色的DOM操作,可靠的事件处理和出色的兼容性等等。下面是我在学习过程中做的思维导图(全屏查看:):jQuery的简介: jQuery是一个兼容多浏览器的javascript框架,核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布,吸引了来自世界各地的众多JavaScript高手加入,由Da. 阅读全文
-
Bootstrap3.0学习14
摘要:Bootstrap3.0学习第十四轮(分页、徽章)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要来讲解以下内容1.分页2.徽章3.总结分页 为您的网站或应用提供多页的分页组件,或是用更简单的翻页替换。默认分页发出了这个简单的分页,用在应用或搜索结果中超级棒。这个大块容易看见,容易缩放并有大块的点击区域。 « 1 2 3 4 5 » 激活和禁用状态链接在不同情况下可... 阅读全文
-
利用Bootstrap框架制作查询页面的界面
摘要:UI设计实战篇——利用Bootstrap框架制作查询页面的界面Bootstrap框架是一个前端UI设计的框架,它提供了统一的UI界面,简化了设计界面UI的过程(缺点是定制了界面,调整的余地不是太大)。尤其是现在的响应时布局(我的理解是页面根据不同的分辨率,采用不同的页面元素的布局),在Bootstrap中很好的支持了,只要简单设置了属性,就能自动实现响应时布局,大大简化了程序员的界面的过程。因此,本人用Bootstrap框架实现了如下的界面,虽然简单,但也不凡(真要自己实现的话,不知要猴年马月了)整个页面分为几个部分,分别用Bootstrap官网上的示例代码实现,最终拼成一个页面。各部分示意如 阅读全文
-
Bootstrap3.0学习第十轮(下拉菜单、按钮组、按钮式下拉菜单)
摘要:Bootstrap3.0学习第十轮(下拉菜单、按钮组、按钮式下拉菜单)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html终于把前面关于Bootstrap CSS部分简单的学习了一遍,应该忽视了比较多的细节问题。不过大部分的内容我都过了一遍,并且用代码实现了一遍,而且看到了真是的效果。挺不错的。那么接下来的几篇文章主要来讲解Bootstrap的组件。那么本文主要来讲解以下内容1.下拉菜单2.按钮组3.按钮式下拉菜单4.总结再来熟悉一下这个开始建立一个页面的代码,首先新建一个测试网页加入如 阅读全文
-
Bootstrap3.0学习第九轮(CSS补充)
摘要:Bootstrap3.0学习第九轮(CSS补充)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文学习的内容主要如下所示:1.浏览器支持2.图片3.响应式工具4.遇到的问题5.总结浏览器支持 Bootstrap的目标是在最新的桌面和移动浏览器上有最佳的表现,也就是说,在较老旧的浏览器上可能会导致某些组件表现出的样式有些不同,但是功能是完整的。 被支持的浏览器 特别注意,Bootstrap坚决支持这些浏览器的最新版本:Chrome (Mac、Windows、iOS和Androi... 阅读全文
-
Bootstrap3.0学习第八轮
摘要:Bootstrap3.0学习第八轮(工具Class)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文学习的内容主要如下所示:1.关闭按钮2.Carets3.快速设置浮动4.内容区域居中5.清除浮动6.显示或隐藏内容7.针对屏幕阅读器的内容8.图片替换9.总结关闭按钮通过使用一个象征关闭的图标,可以用来让模式对话框和警告框消失。 ×Carets使用插入符表示下拉的功能和方向。请注意,默认插入符会自动反转在dropup菜单。 快速设置浮动过这两个class让页面元 阅读全文
-
formValidator
摘要:formValidator输入验证、异步验证实例 + licenseImage验证码插件实例应用实例技术:springmvc实现功能:完整用户登录流程、输入信息规则校验、验证码异步校验.功能清单:1.springmvc控制器处理get请求(/member/login.html),进行静态页面跳转到用户登录页2.Springmvc控制器处理post请求(/member/login.html),进行登录实际业务处理3.验证实例包含常规输入验证+异步验证,使用验证插件formValidator插件下载:验证插件下载:http://www.cnblogs.com/wzmaodong/archive/2 阅读全文
-
jquery 分页控件2
摘要:jquery 分页控件(二) 上一章主要是关于分页控件的原理,代码也没有重构。在这一章会附上小插件的下载链接,插件主要就是重构逻辑部分,具体可以下载源文件看下,源代码也有注释。为了测试这个插件是能用的,我弄了个简单的asp.net例子(vs 2010)。通过ajax根据每一页请求数据,数据是使用json格式进行传输,通过knockout.js绑定。在这里顺便推荐一下汤姆大叔的Knockout应用开发指南,是学习Knockout非常好的文章。惯例:插件Demo Asp.net Demo效果图: 主要思路是通过分页控件的callback方法把 当前页 和 每页显示数量 传给pageselectC. 阅读全文
-
Bootstrap3.0学习第七轮(按钮)
摘要:Bootstrap3.0学习第七轮(按钮)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要讲解的是按钮的样式。1.选项2.尺寸3.活动状态4.禁用状态5.可做按钮使用的Html标签6.总结选项使用上面列出的class可以快速创建一个带有样式的按钮。 Default Primary Success Info Warning Danger 链接尺寸需要让按钮具有不同尺寸吗?使用.bt... 阅读全文
-
jquery 分页控件1
摘要:jquery 分页控件(一)以前一直都是用别人的分页控件,虽然用得很爽,但总觉的还是自己写个小插件比较好,这个插件效果、代码等都有参照别人完成的控件。即便功能并不是那么完善,扩展性也不好,bug或许还很多。个人觉得,适合自己用就行了。你对自己写的肯定会比较熟悉,当插件需要不停的重构,这个插件就慢慢完善了。现在要做的是走出开头的那一步。往往都是因为开头的那一步阻碍了我们。废话一大堆........惯例Demo下载效果图:一、定义基础数据 //基础数据 var current_page = 1; //当前页 var num_edge = 4; //省略号前后显示数量 ... 阅读全文
-
Bootstrap3.0学习第六轮(表单)
摘要:Bootstrap3.0学习第六轮(表单)前言阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html本文主要讲解的是表单,这个其实对于做过网站的人来说,并不陌生,而且可以说是最为常用的提交数据的Form表单。本文主要来讲解一下内容:1.基本案例2.内联表单3.水平排列的表单4.被支持的控件5.静态控件6.控件状态7.控件尺寸8.帮助文本9.总结基本案例单独的表单控件会被自动赋予一些全局样式。所有设置了.form-control的、和静态控件在水平布局的表单中,如果需要将一行纯文本放置于labe 阅读全文
-
写JQuery 插件
摘要:什么?你还不会写JQuery 插件前言 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了。至于使用jquery好处这里就不再赘述了,用过的都知道。今天我们来讨论下jquery的插件机制,jquery有着成千上万的第三方插件,有时我们写好了一个独立的功能,也想将其与jquery结合起来,可以用jquery链式调用,这就要扩展jquery,写成插件形式了,如下面就是一个简单扩展Jquery对象的demo: //sample:扩展jquery对象的方法,bold()用于加粗字体。 (functio... 阅读全文
-
jQuery选择器
摘要:jQuery简介以及jQuery选择器一 简介1 定义:jQuery库是JavaScript的封装库2 优点:1) : 代码开源2) : 选择器强大3) : 完善的Ajax4) : 浏览器兼容性高5) : 文档完善(帮助文档多并且完善)6) : 链式操作7) : 轻量级(库的大小较小)8) : 行为层与结构层分离9) : 事件兼容性强大10) : dom操作封装出色11) : 隐式迭代(不需显示的写循环)12) : 不污染顶级变量(采用闭包)13) : 插件丰富3 使用起首方式:$(document).ready(function(){})$(function(){})4 与javaScrip 阅读全文
-
Bootstrap3.0学习第三轮(栅格系统案例)
摘要:Bootstrap3.0学习第三轮(栅格系统案例)前言 在前面的一篇文章当中http://www.cnblogs.com/aehyok/p/3400499.html主要学习了栅格系统的基本原理,以及通过简单案例进行对原理的实践。通过今天对中文网http://www.bootcss.com/的进一步了解,决定将原来的《Bootstrap3.0学习第三轮(布局)》修改成了《Bootstrap3.0学习第三轮(栅格系统原理)》,也是希望能够跟随Bootstrap网站上介绍的名词吧。 那么本文的主要内容将主要分为以下几个部分 1.栅格选项 2.从堆叠到水平排列 3.移动设备和桌面... 阅读全文
-
Bootstrap3.0入门学习系列
摘要:Bootstrap3.0入门学习系列规划[持续更新]前言 首先在此多谢博友们在前几篇博文当中给与的支持和鼓励,以及在回复中提出的问题、意见和看法。 在此先声明一下,之前在下小菜所有的随笔文章中,只有前两篇关于Bootstrap的文章发表在了博客园的首页,对于发布的这两篇文章的感受就是:大家的参与度比之前的高很多。当然也不是说看到自己的文章发布在首页,有了几千甚至几万访问量,个人觉得自己所分享的一点东西可能对于大家也是有一点效果的,自己从评论中可以看出是真的有那么一群人仔细看了自己写的文章,会让你之后写文章的时候更加的仔细,也更加自信,自己也从中得到更多的帮助、成长、快乐。希望有更多的人投入.. 阅读全文