随笔分类 - 特效
1
摘要：在上一篇随笔中已经将如何发布动态呈现了，那么现在来看一下剩下的评论动态、回复评论、删除动态和评论功能，这几个功能会有点绕~~~ 一、思路如下： （1）你发表动态之后，会有人评论这一条动态，当评论之后，你也会回复该评论；（此处评论要单独一张表，回复也要单独一张表） （2）删除动态：会将动态连同评论、回
阅读全文
摘要：我们大部分人都发过动态，想必都知道发动态、回复评论、删除动态的整个过程，那么作为初学者，要模仿这些功能有点复杂的，最起码表的关系得弄清楚~~ 先把思路理一下： （1）用户登录，用session读取当前用户 目的是：该用户可以发表动态，重点是显示该用户好友及他自己发表的动态，并且按发表时间排序。 （2
阅读全文
摘要：在上一篇随笔http://www.cnblogs.com/chenguanai/p/6883401.html中，已经了解了头像的上传预览和裁剪功能；那么这次就再看一下imgareaselect的裁剪功能~~~ 有时候，我们裁剪某一区域时，分别会有大中小三个头像显示着~~~也就是如下图所示，当在右边的
阅读全文
摘要：上一节随笔中，我们已经知道了关于jQuery插件ImgAreaSelect基本的知识；那么现在看一下实例： 首先，要知道我们应该实现什么功能？ （1）图片能够实现上传预览功能 （2）拖拽裁剪图片，使其能够显示裁剪后的区域 （3）显示要裁剪区域的坐标 其次，该如何引用该插件呢？ 那就具体看一下吧！ 第
阅读全文
摘要：关于ImgAreaSelect, 是一jQuery插件，它支持用户通过鼠标拖曳选择图片的一部分，如图片拖曳、图片编辑等~~来具体看一下 1、先下载imgAreaSelect插件 下载地址： 英文：http://odyniec.net/projects/imgareaselect/ 中文：http:/
阅读全文
摘要：davidvogin bigfishpresentations madebyguerrilla serious-studio fixx 源于http://www.cnblogs.com/lhb25/archive/2012/09/20/30-single-page-portfolio-website
阅读全文
摘要：主要实现效果： 1、点击对话，显示对话；点击联系人，显示联系人 2、在联系人界面： 实现好友列表的展开与折叠；（图12） 实现鼠标移到好友列表上的背景颜色的变化；（图3） 选中的好友背景颜色改变（图4） 代码如下： 还需完善： 1、对话列表，群聊等未布局 2、什么时候能与数据库对接呢？聊天功能未实现
阅读全文
摘要：这是一篇关于网站易用性的文章，如今网站的易用性已成为一种趋势，但纵观国内的各大网站，似乎易用性并未成为设计者们广泛理解的概念，所以才将用户体验上升为搜索引擎优化乃至网络推广的制高点。总之耐心看完 ，相信你一定会有所收获的。（原文地址：http://www.51xuediannao.com/ui/so
阅读全文
摘要：实现功能： 1、输入字符要在6-16之间；小于6个字符或大于16个字符时给予提示，而且强弱不显示；为0时，也给予提示； 2、当密码在6-16个字符之间时，如果密码全是数字或全是字母，显示弱；密码是数字与字母的组合，则显示强；若为字母数字加下划线，则为强； 效果图如下： 代码如下： 注：代码为本人原创
阅读全文
摘要：实现效果： 1、文本框输入内容，低端字数对应减少 2、当文本框内容超出时，会显示字数超出多少 效果图如下： 实现代码： <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> #aa{ height: 1
阅读全文
摘要：效果如下：依次为图一 图二 图三 图四 主要实现效果： 点击主标题显示下拉好友，再点击收起下拉好友；鼠标移到好友上背景颜色改变；选中的好友背景颜色也要改变； 代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h
阅读全文
摘要：效果如图所示： 代码如下： <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin:0px; padding: 0px; font-family: "微软雅黑"; } .box{ he
阅读全文
摘要：点击下方图片轮播： 关键点：onmouseover ，onmouseout两个事件；DOM； <style>#datu{ width:400px; height:300px; position:relative; margin:20px auto; overflow:hidden; }#ta{ po
阅读全文
摘要：利用js写的图片点击轮播： 关键点： 有向左向右的按钮；需要点击事件；DOM 重在理解 </head> <style> .picture-top{ width: 1000px; height: 300px; background-color: peachpuff; position: relativ
阅读全文
摘要：显示多张的图片轮播： 关键点：算好div,table,图片的宽度 <style> *{ margin: 0px; padding: 0px; } .nav{ width: 800px; height: 200px; position: relative; background-color: yell
阅读全文
摘要：一张一换，其他的都隐藏着： 第一种：利用td表格： </head><style>*{ margin:0px; padding:0px;}#datu{ width:200px; height:100px; border: 1px solid #000; overflow:hidden; positio
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0px; padding: 0px; } .mask{ width: 100%; /* height: 800px;*/ z
阅读全文
摘要：动态网站第一步：动态下拉菜单 关键点： overflow:hidden max-height xx:hover {} 设置当鼠标移上之后的效果 transition: 设置过度时间 cursor: 设置鼠标效果 opacity: 设置透明度 0-1 如下图所示 <!DOCTYPE html><htm
阅读全文
摘要：1、用css做动画效果： 放鼠标才会发生 利用hover <head> <style> #aa{ background-color: red; width: 100px; height: 120px; margin-top: 50px; } #aa:hover{ /* 鼠标放在图片上发生的变化,鼠标
阅读全文
摘要：一、通过设置边框 正方形、三角形 <style> .c{ height: 0px; width: 0px; border-top: 50px solid red; border-right: 50px solid yellow; border-bottom: 50px solid green; bo
阅读全文
1
浙公网安备 33010602011771号