25 个响应式的 jQuery 导航菜单插件

2014年11月23日源创会年度盛典(北京站)正在报名 每次发这类文章时,用户集中反馈的问题包括: 好像以前发过 —— 答:标题类似,内容不同 怎么只有名称和图片,没有介绍 —— 答:介绍千篇一律,没什么特别的,图片更加直接,当然了最主要是为了偷懒,哈哈 怎么那么多前端的内容? —— 答:多不好吗? 1. MenuItems 2. Sidr 3. Material Menu 4. Responsive Tabbed Navigation 5. PGW Menu 6. jQuery Slimmenu 7. jQuery Sliding Menu 8. Responsive Tabs 9. Mmenu 10. Flex Nav 11. Responsive Full Width Tabs 12. Fixed Nav 13. Daisy Nav 14. Navgoco 15. Naver 16. Smart Menus 17. jQuery Fluid Content Scroller 18. Menu-aim 19. HorizontalNav 20. SlickNav 21. TinyNav.js 22. Menutron 23. Flaunt.js 24. jPanel Menu 25. Repsonsive Toggle Menu via codegeekz from:http://www.oschina.net/news/56988/responsive-jquery-navigation-plugins

龙生   13 Nov 2014
View Details

为你下一个项目准备的 50 个 Bootstrap 插件

Bootstrap是快速开发Web应用程序的前端工具包。它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等。 本文向你推荐 50 个 Bootstrap 的插件,可以考虑在你下一个项目中使用它们。 1. Bootstrap Multiselect 2. Bootstrap Dialog 3. Bootstrap Confirmation 4. Bootstrap Tag Input 5. Bootstrap File Input 6. Bootstrap WYSIWYG 7. Bootstrap Select 8. pNotify Pines Notify 是一个 JavaScript 的消息提醒插件,基于 Bootstrap 框架和 jQuery UI 框架。 9. Bootstrap Forms Helper 10. Pongstagr.am 11. X-editables X-editable 基于 Bootstrap、jQuery UI 和 jQuery 实现了网页文本即时编辑的功能。支持包括文本框、textarea、下拉列表、日期选择等。支持 IE7+ 和其他浏览器。 12. Bootstrap Lightbox Plugin 13. Editable Table 14. Timepicker 15. ClockPicker 16. Bootstrap Video Player 17. Bootstrap Progressbar 18. jQuery Sortable 19. Bootstrap Star Rating 20. Bootstrap Growl 21. Feedback […]

龙生   12 Nov 2014
View Details

利用mysql的binlog恢复数据

MySQL Binary Log也就是常说的bin-log, ,是mysql执行改动产生的二进制日志文件,其主要作用有两个: * 数据回复 * 主从数据库。用于slave端执行增删改,保持与master同步。 1.开启binary log功能 需要修改mysql的配置文件,本篇的实验环境是win7,配置文件为mysql安装目录\MySQL Server 5.1下的my.ini,添加一句log_bin = mysql_bin即可 eg: [mysqld] …… log_bin = mysql_bin …… log_bin是生成的bin-log的文件名,后缀则是6位数字的编码,从000001开始,按照上面的配置,生成的文件则为: mysql_bin.000001 mysql_bin.000002 …… 配置保存以后重启mysql的服务器,用show variables like  '%bin%’查看bin-log是否开启,如图: 2.查看产生的binary log bin-log因为是二进制文件,不能通过记事本等编辑器直接打开查看,mysql提供两种方式查看方式,在介绍之前,我们先对数据库进行一下增删改的操作,否则log里边数据有点空。 create table bin( id int(10) primary key auto_increment,name varchar(255));(测试前我已经建表) insert into bin(name) values ('orange'); 1.在客户端中使用  show binlog events in 'mysql_bin.000001'  语句进行查看,为了排序美观,可以在结尾加\G使结果横变纵,此时结尾无需加;语句结束符。 eg: mysql> show binlog events in 'mysql_bin.000001’\G ……………省略…………… *************************** 3. row *************************** Log_name: mysql_bin.000001 Pos: 174 Event_type: Intvar Server_id: 1 End_log_pos: 202 Info: INSERT_ID=2 *************************** 4. row *************************** Log_name: mysql_bin.000001 Pos: 202 Event_type: Query […]

龙生   12 Nov 2014
View Details

binlog文件分析与mysqlbinlog工具的修改

问题 本文主要带着以下问题进行学习: 1、什么是binlog,有什么作用 2、binlog有哪些格式 3、分析一条典型binlog ,说明从binlog中可以得到哪些信息 4、如何修改mysqlbinlog,使得可以显示最后一条记录 这里主要考虑binlog的使用及相关格式,而不是关注binlog的写入时机。   一、简介 binlog又叫二进制日志文件,它会将mysql中所有修改数据库数据的Query以二进制的形式记录到日志文件中,如:create,insert,drop,update等;(对于select操作则不会被记录到binlog里,因为它并没有修改数据库的数据)。binlog一般存储在数据目录下,并且命名为:mysql-bin.***(这个可以在配置文件中修改my.cnf:log-bin=mysql-bin,就是文件名的前缀;mysqld在每个 binlog 名后面添加一个数字扩展名。每次启动服务器或刷新日志时增加文件的大小大于max_binlog_size,一个事务不会被拆分开)。 binlog主要是用于保证数据完整的,如主从备份,通过从binlog文件中读取操作来在salve机上进行同样的操作,保证主从备份,当然不可能每次都从开始的地方redo,所以每条记录都有一个时间截TIMESTAMP。   二、简单的使用binlog show binary logs;    #显示binlog文件 purge binary logsto 'mysql-bin.**'  #删除到**文件 bin/mysqlbinlog binlogfile    #解析binlog文件   利用binlog恢复数据: bin/mysqlbinlog  --start-datetime=’2011-7-7 18:0:0′--stop-datetime=’2011-7-7 20:07:13′ data/mysql-bin.000008 |mysql -u root   三、类型 binlog的格式有三种,这也反应了mysql的复制技术:基于SQL语句的复制(statement-based replication, SBR),基于行的复制(row-based replication, RBR),混合模式复制(mixed-based replication, MBR)。相应地,binlog的格式也有三种:STATEMENT,ROW,MIXED。 mysql>showvariables like 'binlog_format'    #查看binlog的格式   使用mysqlbinlog解析的binlog: MIXED(STATEMENT): # at 193(开始位置) #110708 10:03:06(时间截) server id(产生该事件的服务id) 1  end_log_pos(日志的结束位置) 280  Query(事件类型)  thread_id=10    exec_time=0     error_code=0 SETTIMESTAMP=1310090586/*!*/; insert into tvalues(17) /*!*/;   ROW模式: BEGIN /*!*/; # at 174 # at 214 #110708 10:49:22server id 1  end_log_pos 214   Table_map: […]

龙生   12 Nov 2014
View Details

Mysql Binlog三种格式介绍及分析

一.Mysql Binlog格式介绍       Mysql binlog日志有三种格式,分别为Statement,MiXED,以及ROW! 1.Statement:每一条会修改数据的sql都会记录在binlog中。 优点:不需要记录每一行的变化,减少了binlog日志量,节约了IO,提高性能。(相比row能节约多少性能与日志量,这个取决于应用的SQL情况,正常同一条记录修改或者插入row格式所产生的日志量还小于Statement产生的日志量,但是考虑到如果带条件的update操作,以及整表删除,alter表等操作,ROW格式会产生大量日志,因此在考虑是否使用ROW格式日志时应该跟据应用的实际情况,其所产生的日志量会增加多少,以及带来的IO性能问题。) 缺点:由于记录的只是执行语句,为了这些语句能在slave上正确运行,因此还必须记录每条语句在执行的时候的一些相关信息,以保证所有语句能在slave得到和在master端执行时候相同 的结果。另外mysql 的复制,像一些特定函数功能,slave可与master上要保持一致会有很多相关问题(如sleep()函数, last_insert_id(),以及user-defined functions(udf)会出现问题). 使用以下函数的语句也无法被复制: * LOAD_FILE() * UUID() * USER() * FOUND_ROWS() * SYSDATE() (除非启动时启用了 --sysdate-is-now 选项) 同时在INSERT …SELECT 会产生比 RBR 更多的行级锁 2.Row:不记录sql语句上下文相关信息,仅保存哪条记录被修改。 优点: binlog中可以不记录执行的sql语句的上下文相关的信息,仅需要记录那一条记录被修改成什么了。所以rowlevel的日志内容会非常清楚的记录下每一行数据修改的细节。而且不会出现某些特定情况下的存储过程,或function,以及trigger的调用和触发无法被正确复制的问题 缺点:所有的执行的语句当记录到日志中的时候,都将以每行记录的修改来记录,这样可能会产生大量的日志内容,比如一条update语句,修改多条记录,则binlog中每一条修改都会有记录,这样造成binlog日志量会很大,特别是当执行alter table之类的语句的时候,由于表结构修改,每条记录都发生改变,那么该表每一条记录都会记录到日志中。 3.Mixedlevel: 是以上两种level的混合使用,一般的语句修改使用statment格式保存binlog,如一些函数,statement无法完成主从复制的操作,则采用row格式保存binlog,MySQL会根据执行的每一条具体的sql语句来区分对待记录的日志形式,也就是在Statement和Row之间选择一种.新版本的MySQL中队row level模式也被做了优化,并不是所有的修改都会以row level来记录,像遇到表结构变更的时候就会以statement模式来记录。至于update或者delete等修改数据的语句,还是会记录所有行的变更。   二.Binlog基本配制与格式设定 1.基本配制 Mysql BInlog日志格式可以通过mysql的my.cnf文件的属性binlog_format指定。如以下: binlog_format           = MIXED                 //binlog日志格式 log_bin                  =目录/mysql-bin.log    //binlog日志名 expire_logs_days    = 7                //binlog过期清理时间 max_binlog_size    100m                    //binlog每个日志文件大小 2.Binlog日志格式选择 Mysql默认是使用Statement日志格式,推荐使用MIXED. 由于一些特殊使用,可以考虑使用ROWED,如自己通过binlog日志来同步数据的修改,这样会节省很多相关操作。对于binlog数据处理会变得非常轻松,相对mixed,解析也会很轻松(当然前提是增加的日志量所带来的IO开销在容忍的范围内即可)。 3.mysqlbinlog格式选择 mysql对于日志格式的选定原则:如果是采用 INSERT,UPDATE,DELETE 等直接操作表的情况,则日志格式根据 binlog_format 的设定而记录,如果是采用 GRANT,REVOKE,SET PASSWORD 等管理语句来做的话,那么无论如何 都采用 SBR 模式记录 三.Mysql Binlog日志分析 通过MysqlBinlog指令查看具体的mysql日志,如下: /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// SET TIMESTAMP=1350355892/*!*/; BEGIN /*!*/; # at 1643330 #121016 10:51:32 server […]

龙生   12 Nov 2014
View Details

Windows下MySQL日志的启用

1.    首先连接上mysql,查看日志服务是否开启 点击(此处)折叠或打开 show global variables like \’log_bin%\'; 输入上面的命令可以查看当前mysql的日志服务是否开启,图为OFF状态,表示还未开启,MySQL默认状态下是未开启日志服务的。 2.    开启日志服务 配置MySQL根目录下的my.ini文件,在[mysqld]下面添加存放日志的路径,此处我写的是绝对路径,在MySQL的根目录下我创建了log/log-bin/logbin.log路径, 创建目录时要注意以下两点: a)    目录的文件夹命名中不能有空格,否则在访问日志时会报错。 b)    指定目录时要以*.log结尾,即不能仅仅指定到文件夹的级别,上面我创建的路径写了logbin.log,那么在log/log-bin/目录下会产生logbin.000001和logbin.index两个日志文件; 否则不会有日志文件产生。 3.    重启mysql服务 my.ini文件修改后保存,需要重启mysql服务才能生效。windows下右键“计算机”->“管理”->“服务和应用程序”->“服务”里面,选择“MySQL”,然后点击“重启动”,即完成重启服务。 4.    再次查看mysql的日志服务状态,就会看到开启状态 5.    查看日志 在DOS状态下,进入MySQL的bin目录下执行mysqlbinlog命令,可以查看指定的日志文件,例如查看logbin.000001日志 要注意查看日志的目录,因为我的日志目录是和bin在同一级别中,因此先../返回上级目录,再查找log/log-bin/logbin.000001日志。 from:http://blog.itpub.net/29660208/viewspace-1188431/

龙生   12 Nov 2014
View Details

四款超棒的 jQuery 数字化签名插件

在浏览器中,我们有很多方式来绘制生成签名效果,并且有很多很棒很智能的jQuery插件。数字化签名是未来的发展方向,正是这个原因我们这里收集并且推荐了四款超棒的jQuery数字化签名插件,希望大家喜欢! 1. jSignature 这个jQuery插件简化了创建数据签名的过程,允许用户使用鼠标,手写板,手指来绘制签名。这里是演示 2. Signature Pad 这个jQuery插件可以辅助使用HTML5画布来实现数字签名。它保存签名为JSON,并且可以以后再重新生成,这里是演示 3. jQuery UI Signature 这个jQueryUI插件帮助捕捉或者绘制签名。要求jQuery UI组件和鼠标模块,如果需要支持老版本IE的话,需要excanvas.js。 4. jSignature 一个jQuery插件帮助添加web签名功能的插件。这里可以查看演示 阅读原文:四款超棒的jQuery数字化签名插件 from:http://www.oschina.net/news/53718/4-jquery-signature-plugins

龙生   07 Nov 2014
View Details

30 个 jQuery & CSS3 加载动画和进度栏插件

喜欢哪个赶紧带走,过期不候。 Animated Progress Bars with CSS3 [ Demo | Download ] Spin JS Bar [ Demo | Download ] The Facebook loading animation [ Demo | Download ] Flickr Style Loading Animation [ Demo | Download ] CSS3 Loading Spinners Without Images [ Demo | Download ] Sonic.js [ Demo | Download ] QueryLoader2 – Preload your images with ease [ Demo | Download ] jQuery Progress Bar [ Demo | Download ] jQuery Ajax Loader & Spinner [ Demo | Download ] Animated jQuery Progressbar [ Demo | Download ] Automatic Page Load & Ajax Request Progress Bar [ Demo | Download ] CSS Load [ Demo | Download ] Mambo [ Demo | Download ] Google Like jQuery Slim Progress Bar Plugin [ Demo | Download ] CanvasLoader Creator [ Demo | Download ] Loader Bar [ Demo | Download ] Animated Progress Bar [ Demo | Download ] Animated Progress Bar in 4 […]

龙生   07 Nov 2014
View Details

为开发者们准备的 10 款超棒的 jQuery 视频插件

jQuery 是一种快速、简洁的 JavaScript 库,可以简化 HTML 文档遍历、事件处理、动画和 Ajax 交互,能快速进行 web 开发。一个 jQuery 插件基本上是一种新方法,用来扩展 jQuery 原型对象。当扩展原型对象时,所有的 jQuery 对象就会启用并且能够添加和继承其他的任何方法。 1. Bigvideo.js BigVideo.js 是一个 jQuery 视频插件,能让用户很方便将视频作为网站的背景并且能够生成自适应的视频背景。它可以播放一个无声视频(或一系列视频),或者像播放器一样提供一个视频列表给用户,让他们选择喜欢的进行播放。这个插件基于 Video.js 构建。此外如果有些设备不支持自动播放则转换成用图片来显示。这款插件要求 jQuery UI(滑块控制)和 jQuery 图像加载插件。在线演示 2. jPlayer jPlayer 是个完全免费和开源的媒体库 (media library)。作为jQuery插件的一员,使用jPlayer可以在你的网页上轻松加入跨平台的音乐和视频。通过jPlayer的API,你可以构想出具有创意的影音解决方案。  在线演示 3. Tubular Tubular 是一款 jQuery 插件,允许用户自由的设置 YouTube 上面的视频作为自己网页的背景。直接使用的时候需要安装 Javascript 和 Flash player 和具有相应功能的客户端浏览器。Tubular 依赖于 jQuery 和swfobject 。用户使用的时候只需要添加到你的 body 标签里面,指定一个 YouTube 的视频 ID 并且把 ID 告诉你的内容封装。需要注意的是,Tubular 必须部署在 web 服务器上。 4. FitVids.js Fitvids.js 是个轻量级,易于使用的 jQuery 插件,用来在网页上播放指定宽度的嵌入视频。Fitvides.js 会自动通过 Thierry Koblentz 的 Intrinsic Ration 方法来在你的响应式网页中实现流体宽度视频。有一款自定义的视频播放器吗?答案是肯定的,Fitvides.js 提供一个 customSelector 自定义选择器,允许用户添加自定义的视频供应商。在线演示 5. BigScreen BigScreen 是一个调用 JavaScript Full Screen API 的 […]

龙生   07 Nov 2014
View Details

20+ 个很有用的 jQuery 的 Google 地图插件

Google 地图在寻找我们想要了解的商店或者其它有趣的地方这种用途方面很流行和实用. 地图被一些商店特地集成到了它们的网站上面,这样就可以让人们容易找到它们的所在. 尽管其并不容易被集成,Google 地图使用起来还是简单且引人注目的. 在你的站点上集成它需要一个漫长且复杂的过程. 但多亏了拥有一个许多实用Google地图插件资源库的jQuery. 你只需要将jQeury地图插件安装到你的站点上,然后就可以开始根据你的业务需要来设计简单但能吸引人的地图了. 在本文中,我会列出一堆实用的jQuery Google地图插件, 它们提供了许多将地图添加到你的站点的功能. 如果你发现这片文章对你有帮助,请将其分享给其他人。如果你有任何其他的意见,请不要迟疑,把它们写在下面吧. WhatsNearby 一个使用Google地图将一个特定点附近的位置标识出来的jQuery插件. 示例 mapsed.js Mappy.js 是一个在一张地图上选择位置的插件. 出了选择位置,你还可以添加或者编辑已经集成到了你自己的数据库中的位置. 示例 JQuery 位置选择器 位置选择器插件可以让你很容易的找到并选择一个Google地图上的位置. 提供中心位置和半径,它还可以选择一片区域. 所有的数据都可以被自动地保存到任何HTML输入元素中,也可以被Javascript处理. 示例 Planetary.js Planetary.js 是一个用来构建很棒的可交互地球的Javascript库. 它使用了D3和TopoJSON来转换和渲染地理数据. Planetary.js 使用了一个基于插件的架构; 甚至于默认的功能都是作为插件实现的. 示例 Leaflet Leaflet 是一个用于对移动装置地图交互友好的现代开源Javascript库. Leaflet 被设计得简单,高性能且很好使用. 它开箱即用,可以很高效的运行在所有主要的桌面和移动平台上, 尽管吸收了现代浏览器HTML5和CSS3的有点,但仍然可以在较老的浏览器上运行. 示例 jQuery 商店定位 这个jQuery差劲啊利用了 Google Maps API 版本3 来创建一个能简单实现的商店选择器. 这需要无后台编程,你只需要向其提供带有所有位置信息的KML,XML或者JSON数据. 示例 Maplace.Js Maplace.js 可以帮助你在你的站点中嵌入Google地图, 并在其上快速创建新建和控制位置的菜单. 示例 MapQuery MapQuery 是一个你可以用来在你的站点上添加地图的jQuery插件. 不管你是要快速地添加一个地图到页面上,还是想构建一个特性丰富的web应用,MapQuery 都是你所需. 示例 jQuery Geo jQuery Geo, 是一个来自Applied Geographics的开源地理学地图项目, 提供一系列能满足你的在线地图应用大部分需求的Javascript API. 示例 Geolocation Geolocation 是一个使用Google Maps API v3来获取访问了你的网页的用户位置的jQuery插件. 示例 gMap gMap 是一个轻量级的JQuery插件,可以帮助你吧Google地图嵌入站点. 示例 VectorMap VectorMap 是一个用来在网页上展示矢量地图和可视化数据的JQuery插件. 示例 Europe : CSS […]

龙生   07 Nov 2014
View Details
1 300 301 302 410