实现发表心情功能通过php+jquery+ajax+mysql技术，大致流程我先给大家理下：主页index.html页面通过ajax获取心情图标及柱状图相关数据，当用户点击其中的一个心情图标时，向后台php发送请求，php对用户cookie验证（是否是首次提交），然后将数据库对应的心情字段内容加1，成功后返回前端页面，告诉首页index页面发表成功，并调整柱状图和统计数据。 请看效果图：html： 先看HTML，我们在index.html中放置一个#msg，用来显示操作结果...
jquery实现右下角旋转环形菜单特效代码，是固定在页面右下角位置，当用户点击了主菜单按钮后，子菜单项会以环状旋转进入页面，并使用animate.css制作动画效果。 效果图如下：在线预览 点击下载 html代码：js代码：$(document).ready(function (ev) {var toggle = $('#ss_toggle');var menu = $('#ss_menu');var rot;$('#ss_toggle').on('click', function (ev) {rot = parseInt($(this).data('rot')) - 180;menu.css('transform...
先给大家附上效果图：最近做项目的时候需要实现一个字符逐个出现的打字效果，用css的clip+css的动画实现的，与自己写的打字机效果相结合，整 理一起，效果很赞。 先来说说这个线条，我们会看到它是条，实际上就是个四周border有规律的显示隐藏，那么这里必定会想到after，before属性， 我们暂且先考虑after。先建立一个box，然后after一个边框接下来要做的就是让它有规律的显示隐藏就可以了，这里要用到clip属性，我这篇文章有讲到...
文章写的不好，还请各位高手指教，不废话了，先上张效果图吧看下：在线演示 下载源码 首先是初始化部分：将除了第一张轮播图片意外的图片都隐藏，并且隐藏向前、向后按钮，使第一个索引按钮处于激活状态。 事件部分：通过jquery的hover()绑定鼠标上悬以及离开时的事件处理， jquery的bind()方法绑定鼠标点击事件处理向前、向后翻动、轮播控制：pre(), next(), play(), start()开始自动轮播，stop()停止自动轮播。 下篇是一...
下图为jquery实现静态条形统计图，在选择题统计中用的比较多。思路：前台JS实现动态数据效果，后台可以拼接字符串或者用JSON加载数据 代码：青苹果条形统计var data="{root:[{id:'10000',name:'先结婚',value:'50'},{id:'10002',name:'先事业',value:'50'}]}"; var data1="{root:[{id:'10000',name:'人类联盟',value:'60'},{id:'10001',name:'兽人部落',value:'25'},{id:'10003',name:'不死亡灵',value:'15'},{id:'10004',name:'暗...
飘花效果的实现——效果图：查看演示 源码下载 需求： 一个jquery，，，这个看标题么就知道了 jQuery Transit还有这个东西http://github.com/rstacruz/jquery.transit jquery对一些效果的扩展 飘花的效果稍微复杂一点，有一定量的JavaScript代码，通过JS+CSS3的组合实现的。观察右边效果，可以大致分解飘花的实现飘花比人物的层级都高飘花数量非常多飘花会有一定的轨迹运动飘花带有渐变的效果飘花带有旋转的效果飘花落到地面会消失...
我们在提交表单的时候，如果没有使用ajax提交，页面都会自己刷新一下，显得非常的不友好，所以我们需要把我们的表单提交修改为ajax的模式，可以让用户清楚地知道他们在提交表单的时候处在哪一个阶段：正在提交？提交成功？ 我简单使用了一下,jQuery Form插件有一下优点: 1.支持提交前验证. 2.支持提交后回调. 3.采用AJAX方式,有很好的用户体验 4.提交方式是灵活.只要指定要提交的form ID即可.想提交那个form.就可提交那个.同时提交...
jquery弹出层插件，支持消息提示、错误提示、确认框提示等。交互体验度非常好，大家都用微信支付、支付宝等完成用户体验度非常的不错。本插件至少要支持IE9+。使用方式也非常的简单、粗暴，很符合大众的jquery插件使用方法。 先给大家演示效果： 在线预览 源码下载 代码如下：Sweet Alert A beautiful replacement for JavaScript's "Alert" Download So... What does it do Here's a comparison of a standard error message. ...
项目需求： 实现原理：当选中当前元素时，给当前元素添加样式，同级元素移除样式。 点击不同的导航菜单实现当前点击的菜单是高亮的,点击导航下面的某个分类,分类所属的导航也必须是高亮的,点击某一篇文章,文章所属的导航菜单也必须是高亮的. 效果图如下：示例代码一： 具体示例代码如下：我爱学习body,ul,ol,li,div,p{margin:0px;padding:0px;} ul{list-style-type:none;border:1px solid blue;background:#4f5b93;height:45px;} u...
原html字符串如下：var text=""+ ""+ "";1、下面使用Jquery库将text字符串变量转为Jquery对象。 Jquery代码如下：其中$(text)就text字符串转为了一个Jquery对象，最后将该Jquery对象的html()将html内容以字符串的形式输出，结果如下：说明了，$(text)Jquery对象代表的是最外层的html元素div。2、将Jquery对象和DOM对象之间互转。 代码如下：var element= $(text).get(0) //element就是一个dom对象var jqueryobj=$(element);//jquer...
本文用示例讲述了如何使用jQuery与PHP及Mysql结合，实现WEB版在线拍照、上传、显示浏览的功能，ajax交互技术贯穿本文始末，所以本文的读者要求具备相当熟悉jQuery及其插件使用和javscript相关知识，具备PHP和Mysql相关知识。点击此处下载源码 HTML首先，我们要建立一个主页面index.html来展示最新上传的照片，我们使用jQuery来获取最新的照片，所以这是一个HTML页面，不需要PHP标签，当然还要建立一个包括用来拍照和上传交互所需...
本文实例讲述了jQuery实现仿百度首页滑动伸缩展开的添加服务效果代码。分享给大家供大家参考。具体如下： 这是一款仿百度首页jQuery滑动伸缩展开的添加服务效果，其实是一款伸缩菜单，只不过这个菜单有点特别，只从一头向另一头伸展出去，菜单的伸缩效果平滑，设计精美。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/js-f-baidu-index-show-serv-style-codes/ 具体代码如下：添加服务*{padding:0;margin:0...
记得去年做某个项目的时候，用到了邮箱输入自动提示功能，于是网上搜了一下，发现了这个写得不错，现在回想起来，转载一下，方便查阅。 邮箱的广泛使用得益于它的免费，因此很多网站在注册的时候都会直接使用邮箱作为账号名 为了提高用户的体验，很多网站都会实现邮箱输入的自动提示功能。 实现效果如图所示：核心代码（需要jquery的支持）：(function($){$.fn.mailAutoComplete = function(options){var defaults = {boxClass: "m...
那么今天就来介绍这款fullPage，与fullPage.js是不同的，fullpage兼容性更佳，能向下兼容到IE6， 不依赖任何 js 库，可独立使用。功能上虽然不如 fullPage.js 强大，但一般使用已经足够了，尤其是它的动画效果，你可以自由设定缩放、旋转以产生各种各样的动画效果。同时它还支持 fullPage.js 所没有的水平滚动。 兼容桌面端(ie5.5+) 和 手机端你可以用它来构建你的个人主页或者网页应用这是一个不使用jQuery小巧的框架 不到9KB再介...
本文实例讲述了jQuery实现为控件添加水印文字效果。分享给大家供大家参考，具体如下： 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-text-add-txt-style-codes/ 具体代码如下：WaterMark $(function() { $("input[title='Month']").watermark('watermark','Title'); $("textarea[title='Content']").watermark('watermark','Please input the content !');; }); .watermark {color:#999;} ...