WEB前端
redstarofsleep
这个作者很懒,什么都没留下…
展开
-
用HTML5canvas绘制一个圆环形的进度表示
文章搬至CSDN, 最新内容请访问: http://blog.csdn.net/redstarofsleep/article/details/45092115 先看一下画出来的效果,如下图,这样一个圆环形的进度. 我这里使用HTML5的Canvas来要制作这样一个圆环形的进度, 首先是HTML页面,HTML5的文档标识是:<!DOCTYPE html> 这个...2013-08-02 10:05:08 · 346 阅读 · 0 评论 -
js获取浏览器高度和宽度值(转)
网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWidth (包括边线的宽)网页可见区域高: document.body.offsetHeight (包括边线的高)网页正文全文宽: document.body.scrollWidth...原创 2010-12-01 22:34:06 · 66 阅读 · 0 评论 -
Javascript捕获鼠标位置(跨浏览器)
Javascript获取鼠标位置,显示Memo,相当于Alt和Title属性,但是要比Alt和Title拉风啊<html> <head> <script type="text/javascript"> function showMemo(evt,data) { /...2010-12-01 22:28:35 · 113 阅读 · 0 评论 -
纯JS网页上的动态折线图
用Javascript写了一个网页上的动态折线图,类似心电图的那种.其中的画线用到的是我上一篇文章里写的那种方法.http://redstarofsleep.iteye.com/blog/1109116先是简单的Demo页面:<div class="outer" id="outer"> <div class="inner"></div>..2011-07-03 23:05:44 · 1067 阅读 · 0 评论 -
JQuery选择器总结(2) 基础过滤选择器
上一次总结了JQuery的一些基础选择器(http://redstarofsleep.iteye.com/blog/930579).这次继续接下去: 3. 筛选,过滤选择器(1) :first 这个选择器用来选择符合要求的第一个元素// 选取第一个DIV$('div:first')<div>被选中</div><div>没被...2011-03-06 17:12:03 · 69 阅读 · 0 评论 -
JS画线,虽然很原始,但是兼容所有浏览器
用Javascript画线的方法很多,有SVG,VML、canvas等,但是在现阶段,貌似这些方法都不能兼容所有浏览器。所以我还是用最原始的办法法写了一个画线方法。思路也很简单,就是用一个像素的DIV拼成一条线。function line(startX, startY, endX, endY, container) { if (startX == endX) { if (startY...2011-06-29 10:31:00 · 195 阅读 · 0 评论 -
JQuery选择器总结(1)基础篇
一个优秀的Javascript库必定要有一个强大的选择器,强大的选择器可以使DOM操作事半功倍.选择器是JQuery的根基,要学习JQuery第一个就是要学习它的选择器. JQuery的选择器使用的是CSS的风格,学习起来也是非常的方便. 这次先介绍简单的基本的一些选择器 1.基本选择器(1) #id 根据ID选取页面元算,相当于document.getElementB...2011-02-25 23:29:17 · 74 阅读 · 0 评论 -
引入CSS 的两种方式:link和@import的区别[转]
引入css外部文件的两种方法为在html页面通过link,src属性(注意空链接时的陷阱!),再者是通过CSS文件本身通过@import url()引入,虽然这两种方式都可以加载进来CSS文件,可是link和@import也存在着细微的差别。隶属上的差别link属于XHTML标签,而@import完全是CSS提供的一种方式。link标签除了可以加载CSS外,还可以做很多...原创 2011-09-20 09:43:50 · 113 阅读 · 0 评论 -
CSS3圆角,阴影,透明
CSS实现圆角,阴影,透明的方法很多,传统的方法都比较复杂,用CSS3就方便很多了,虽然现在各浏览器对CSS3的支持还不是很好,但不久的将来CSS3就会普及. 1.圆角CSS3实现圆角有两种方法.第一种是背景图像,传统的CSS每个元素只能有一个背景图像,但是CSS3可以允许一个元素有多个背景图像.这样给一个元素添加4个1/4圆的背景图像,分别位于4个角上就可以实现圆角了..bo...2011-02-15 21:35:10 · 125 阅读 · 0 评论 -
谷歌字体(Google Font)初探 [翻译自Google官方文档]
这个指南解释了如何使用Google Font的API,把网络字体添加到自己的页面上。你不需要任何的编码,你所要做的只是添加一个特定的CSS到HTML页面上,然后把字体关联到这个CSS样式。一个快速的例子:这是一个例子,复制下面的HTML代码到一个文件中:<html> <head> <link rel="stylesheet" typ...2010-12-02 22:24:57 · 218 阅读 · 0 评论 -
AJAX处理以XML返回的响应
Ajax请求,服务器端返回XML形式的数据,在页面上用Javascript处理会非常方便。代码:// 发送请求var req; function getXMLHttpRequest() { var xRequest = null; if (window.XMLHttpRequest) { xRequest = new XMLHttpRequest(); } ...2010-12-03 16:40:48 · 117 阅读 · 0 评论 -
JSR356标准Java WebSocket
文章搬至CSDN, 最新内容请访问: http://blog.csdn.net/redstarofsleep/article/details/45092125 之前几次写WebSocket的例子都是基于某个特定的容器(Tomcat,Jetty),而现在,Oracle发布了JSR356规范,WebSocket的Java API得到了统一,所以只要Web容器支持JSR356,那么我们写We...2013-11-14 11:16:16 · 205 阅读 · 0 评论 -
基于Tomcat的WebSocket(5月8日更新)
2014年2月更新: 此API为Tomcat私有,当时Java没有标准API,现在Java有标准API,JSR536,此API不建议使用,新的用法请参照: http://redstarofsleep.iteye.com/blog/1974620 之前大概的看过WebSocket,当时Tomcat还不支持WebSocket,所以当时写了一篇基于Jetty的WebSocket实现,地址如下...2012-04-17 17:05:59 · 117 阅读 · 0 评论 -
Javascript面向对象之:一.创建类
Javascript语言到目前为止,本身并没有提供类似于class这样的关键字来创建一个类.所以可以认为Javascript本身并不是完全意义上的面向对象的语言.但是Javascript中明明就是有对象的.再加上语言本身的一些特性,我们可以模拟出类,使得Javascript也变成面向对象的./** * 这是一个构造函数,是这个类的开始,当new这个类的对象时被调用 */functi...2012-05-09 16:53:03 · 82 阅读 · 0 评论 -
知识点整理之Java的Cookie操作
创建Cookie// new一个Cookie对象,键值对为参数Cookie cookie = new Cookie("key", "value");// 设置Cookie最大生存时间,以秒为单位,负数的话为浏览器进程,关闭浏览器Cookie消失cookie.setMaxAge(60); // 一分钟// 将Cookie添加到Response中,使之生效response.a...2012-05-07 10:17:05 · 89 阅读 · 0 评论 -
表格表头固定,内容多时滚动内容(2)[改进版]
之前写过一个,把表头的固定,内容多时滚动内容:http://redstarofsleep.iteye.com/blog/1010569当时表格的宽度是固定的,而且滚动条永远在最右边,如果表格的宽度不是具体的像素值,而是百分比,那种方法貌似就不太灵光了啊,所以这次重新写了一个.思路还是有一些区别的,效果上的改进是把滚动条靠到了表格边上,然后表格的宽度可以是百分比,随着浏览器大小的变化自适应....2011-12-31 15:52:40 · 83 阅读 · 0 评论 -
HTML5 WebSocket做聊天室(服务器端基于Jetty8)
早就厌倦了Ajax轮询,一直想试试Web Socket.这次终于体验了一把 这次用的浏览器是Chrome,IE不用提了,不支持,FireFox据说是支持的,但是实际试下来不支持.估计是有自己的API,下次再研究....(以上提到的浏览器都是最新稳定版Chrome15,IE9,Firefox8.0) 开发环境:Eclipse3.7,Jetty8.04 [2012/4/6日更新...2011-12-13 08:33:32 · 181 阅读 · 0 评论 -
网上找的代码太多,自己用JQuery写一个横向滑动切换效果,代码超少
CSS代码: 回帖的问的比较多,解释一下,CSS中的两个Width,*width是针对IE的,因为IE的width是包括边框border的,而其它浏览器是不包括的,所以IE的width比其它的多2个像素..main { width:400px;height:300px;border:0px solid #0F0F0F;overflow:hidden;}.parent {...2011-04-05 18:14:36 · 147 阅读 · 0 评论 -
HTML实体字符
显示结果描述实体名称实体编号不可拆分的空格&nbsp;&#160;<小于号&lt; &#60;> 大于号 &gt; &#62;&and符号 &amp;...2010-12-09 08:42:20 · 89 阅读 · 0 评论 -
表格表头固定,内容多时滚动内容
不多写废话了,都在代码注释中<html> <head> <style type="text/css"> * { margin: 0; padding: 0; } /*所有内容都在这个DIV内*/ .all { width: 100%; border: 1px soli...2011-04-20 22:13:09 · 306 阅读 · 0 评论 -
JQuery的Ajax学习(2)
上一次主要学习了JQuery的Ajax的几个上层方法(http://redstarofsleep.iteye.com/blog/854322),这次主要来学习一下$.ajax()这个底层方法.这次主要学习下这个方法的参数:1. url String类型 接受请求的地址2. type String类型 GET或者POST,默认是GET3. timeout Number类...2011-01-01 23:42:18 · 78 阅读 · 0 评论 -
JQuery的Ajax学习(1)
Jquery提供了Ajax的前端封装,今天学习了一下,使用还是非常的方便的。Jquery中的Ajax操作一共提供了6个方法,分别是$.ajax(),load(),$.get(),$.post,$getScript(),$getJSON()。这6个方法中$.ajax()是最底层的,其它的方法都是基于这个方法的.注:我这里的例子使用的是JSP和Struts21.load()方法lo...2010-12-28 22:06:21 · 109 阅读 · 0 评论 -
网上找的代码太多,自己用JQuery写一个横向滑动切换效果,代码超少
CSS代码: 回帖的问的比较多,解释一下,CSS中的两个Width,*width是针对IE的,因为IE的width是包括边框border的,而其它浏览器是不包括的,所以IE的width比其它的多2个像素..main { width:400px;height:300px;border:0px solid #0F0F0F;overflow:hidden;}.parent {原创 2015-04-17 08:59:55 · 744 阅读 · 1 评论 -
表格表头固定,内容多时滚动内容(2)[改进版]
之前写过一个,把表头的固定,内容多时滚动内容:http://redstarofsleep.iteye.com/blog/1010569当时表格的宽度是固定的,而且滚动条永远在最右边,如果表格的宽度不是具体的像素值,而是百分比,那种方法貌似就不太灵光了啊,所以这次重新写了一个.思路还是有一些区别的,效果上的改进是把滚动条靠到了表格边上,然后表格的宽度可以是百分比,随着浏览器大小的变化自适应.原创 2015-04-17 09:01:33 · 1558 阅读 · 0 评论 -
Javascript面向对象之:一.创建类
Javascript语言到目前为止,本身并没有提供类似于class这样的关键字来创建一个类.所以可以认为Javascript本身并不是完全意义上的面向对象的语言.但是Javascript中明明就是有对象的.再加上语言本身的一些特性,我们可以模拟出类,使得Javascript也变成面向对象的./** * 这是一个构造函数,是这个类的开始,当new这个类的对象时被调用 */functi原创 2015-04-17 09:02:25 · 528 阅读 · 0 评论 -
JQuery选择器总结(1)基础篇
一个优秀的Javascript库必定要有一个强大的选择器,强大的选择器可以使DOM操作事半功倍.选择器是JQuery的根基,要学习JQuery第一个就是要学习它的选择器. JQuery的选择器使用的是CSS的风格,学习起来也是非常的方便. 这次先介绍简单的基本的一些选择器 1.基本选择器(1) #id 根据ID选取页面元算,相当于document.getElementB原创 2015-04-17 08:59:44 · 538 阅读 · 0 评论 -
引入CSS 的两种方式:link和@import的区别[转]
引入css外部文件的两种方法为在html页面通过link,src属性(注意空链接时的陷阱!),再者是通过CSS文件本身通过@import url()引入,虽然这两种方式都可以加载进来CSS文件,可是link和@import也存在着细微的差别。隶属上的差别link属于XHTML标签,而@import完全是CSS提供的一种方式。link标签除了可以加载CSS外,还可以做很多转载 2015-04-17 09:00:59 · 1060 阅读 · 0 评论 -
js获取浏览器高度和宽度值(转)
网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWidth (包括边线的宽)网页可见区域高: document.body.offsetHeight (包括边线的高)网页正文全文宽: document.body.scrollWidth转载 2015-04-17 08:58:28 · 1010 阅读 · 0 评论 -
CSS3圆角,阴影,透明
CSS实现圆角,阴影,透明的方法很多,传统的方法都比较复杂,用CSS3就方便很多了,虽然现在各浏览器对CSS3的支持还不是很好,但不久的将来CSS3就会普及. 1.圆角CSS3实现圆角有两种方法.第一种是背景图像,传统的CSS每个元素只能有一个背景图像,但是CSS3可以允许一个元素有多个背景图像.这样给一个元素添加4个1/4圆的背景图像,分别位于4个角上就可以实现圆角了..bo原创 2015-04-17 08:59:38 · 736 阅读 · 0 评论 -
请求转发与重定向的区别[转]
一、调用方式 我们知道,在servlet中调用转发、重定向的语句如下:request.getRequestDispatcher("new.jsp").forward(request, response);//转发到new.jspresponse.sendRedirect("new.jsp");//重定向到new.jsp在jsp页面中你也会看到通转载 2015-04-17 09:00:47 · 653 阅读 · 0 评论 -
纯JS网页上的动态折线图
用Javascript写了一个网页上的动态折线图,类似心电图的那种.其中的画线用到的是我上一篇文章里写的那种方法.http://redstarofsleep.iteye.com/blog/1109116先是简单的Demo页面: 然后是CSS:div.outer { wid原创 2015-04-17 09:00:18 · 10360 阅读 · 4 评论 -
表格表头固定,内容多时滚动内容
不多写废话了,都在代码注释中 * { margin: 0; padding: 0; } /*所有内容都在这个DIV内*/ .all { width: 100%; border: 1px solid #000000; } /*表头在这个DIV内*/ .title {原创 2015-04-17 09:00:01 · 891 阅读 · 0 评论 -
用HTML5canvas绘制一个圆环形的进度表示
先看一下画出来的效果,如下图,这样一个圆环形的进度. 我这里使用HTML5的Canvas来要制作这样一个圆环形的进度, 首先是HTML页面,HTML5的文档标识是: 这个文档标识要比HTML4的简单多了. 第二步,在页面上创建一个Canvas画布元素:61% 我这里创建了一个长宽都是48像素的画布,因为我要画的圆外直径是48个像素的,在canvas元素中间写的是"6原创 2015-04-17 09:02:44 · 13977 阅读 · 8 评论 -
Javascript捕获鼠标位置(跨浏览器)
Javascript获取鼠标位置,显示Memo,相当于Alt和Title属性,但是要比Alt和Title拉风啊 function showMemo(evt,data) { //alert(evt.clientX); document.getElementById原创 2015-04-17 08:58:22 · 636 阅读 · 0 评论 -
AJAX处理以XML返回的响应
Ajax请求,服务器端返回XML形式的数据,在页面上用Javascript处理会非常方便。代码:// 发送请求var req; function getXMLHttpRequest() { var xRequest = null; if (window.XMLHttpRequest) { xRequest = new XMLHttpRequest(); }原创 2015-04-17 08:58:40 · 968 阅读 · 0 评论 -
JQuery的Ajax学习(2)
上一次主要学习了JQuery的Ajax的几个上层方法(http://redstarofsleep.iteye.com/blog/854322),这次主要来学习一下$.ajax()这个底层方法.这次主要学习下这个方法的参数:1. url String类型 接受请求的地址2. type String类型 GET或者POST,默认是GET3. timeout Number类原创 2015-04-17 08:59:26 · 513 阅读 · 0 评论 -
JQuery的Ajax学习(1)
Jquery提供了Ajax的前端封装,今天学习了一下,使用还是非常的方便的。Jquery中的Ajax操作一共提供了6个方法,分别是$.ajax(),load(),$.get(),$.post,$getScript(),$getJSON()。这6个方法中$.ajax()是最底层的,其它的方法都是基于这个方法的.注:我这里的例子使用的是JSP和Struts21.load()方法lo原创 2015-04-17 08:59:15 · 662 阅读 · 0 评论 -
JS画线,虽然很原始,但是兼容所有浏览器
用Javascript画线的方法很多,有SVG,VML、canvas等,但是在现阶段,貌似这些方法都不能兼容所有浏览器。所以我还是用最原始的办法法写了一个画线方法。思路也很简单,就是用一个像素的DIV拼成一条线。function line(startX, startY, endX, endY, container) { if (startX == endX) { if (startY原创 2015-04-17 09:00:12 · 5214 阅读 · 0 评论 -
HTML5 WebSocket做聊天室(服务器端基于Jetty8)
早就厌倦了Ajax轮询,一直想试试Web Socket.这次终于体验了一把 这次用的浏览器是Chrome,IE不用提了,不支持,FireFox据说是支持的,但是实际试下来不支持.估计是有自己的API,下次再研究....(以上提到的浏览器都是最新稳定版Chrome15,IE9,Firefox8.0) 开发环境:Eclipse3.7,Jetty8.04 [2012/4/6日更新原创 2015-04-17 09:01:16 · 3665 阅读 · 0 评论 -
HTML实体字符
显示结果描述实体名称实体编号不可拆分的空格 小于号< <> 大于号 > >&and符号 & &" 双引号 &quo原创 2015-04-17 08:58:46 · 715 阅读 · 0 评论