这段代码是我从Highcharts的代码中改造出来的，非常感谢Highcharts的作者，先链上Highcharts的地址http://www.highcharts.com/，（Highcharts的统计图代码非常棒，功能超强大，大家可以试试）！
下面附上js区域打印的代码
/****************************************功能代码******************************/
(function(){
window.JPrint = {
print: function () {
var doc = document,
win = window,
container = doc.getElementById("container"),//这里就是你要打印的区域的id,也可以参数传过来，你们懂的:-)
origDisplay = [],
origParent = container.parentNode,
body = doc.body,
NONE = 'none',
childNodes = body.childNodes;
each = function (arr, fn) {
var i = 0,
len = arr.length;
for (; i < len; i++) {
if (fn.call(arr[i], arr[i], i, arr) === false) {
return i;
}
}
};
each(childNodes, function (node, i) {
if (node.nodeType === 1) {
origDisplay[i] = node.style.display;
node.style.display = NONE;
}
});
body.appendChild(container);
win.print();
setTimeout(function () {
origParent.appendChild(container);
each(childNodes, function (node, i) {
if (node.nodeType === 1) {
node.style.display = origDisplay[i];
}
});
}, 1000);
}
};
}());
/*******************************下面是用法**********************************/ JPrint.print();
posted @ 2011-12-29 19:46 煋火 阅读(124) 评论(0) 编辑
支持PHP，Python，Mysql有兴趣的可以留下邮箱,免费试用。
posted @ 2011-12-16 00:08 煋火 阅读(28) 评论(0) 编辑
转自：玉米串
上篇文章介绍了最基本的KISSY Dialog弹出层《简洁好看的popup弹出层源码-KISSY Dialog》，表现效果简洁美观。
现在我在原来代码的基础上加上必填项验证的功能和可拖动功能。
很简单，只加了几行代码就搞定。还是下载就可运行，大家可以对比下代码的不同。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>umtry.com</title>
<meta name="author" content="umtry" />
<meta name="copyright" content="2011-2099 umtry.com" />
<link rel="stylesheet" type="text/css" href="http://a.tbcdn.cn/s/kissy/1.2.0/cssbase-min.css" />
<script type="text/javascript" src="http://a.tbcdn.cn/s/kissy/1.2.0/kissy-min.js"></script>
<style>
/*******全局***************/
body{background:url(../images/bg.jpg) no-repeat; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
table{}
tr{}
th{width:130px;vertical-align:top;}
th.ltitle{text-align:right;padding:7px 10px;}
th.bgc{background-color:#edfaff;}
td{vertical-align:top;padding:7px 7px;}
/*******通用弹出层***************/
.dialog{position:absolute;left:-9999px;top:-9999px;}
.pupo{background-color:#ffffff;border:1px solid #c2d5e3;padding:1px 2px;}
.pupo .header{-moz-border-radius: 3px;-webkit-border-radius: 3px;-khtml-border-radius: 3px;border-radius: 3px;background-color:#6ecff9;font-size:15px;font-weight:border;padding:4px 5px;}
.pupo .body{padding:5px 5px;}
.pupo .footer{text-align:right;}
/*******弹出层底部按钮****************/
.my-button-cls {
text-align: center;
background: #AACF4C;
border: 1px solid #86A33B;
padding: 4px 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
color: white;
margin: 10px 10px;
cursor: default;
}
</style>
</head>
<body>
<input type="button" name="addnotice" id="addnotice" value="点我试试">
<!------------------------------------------------------->
<div class='dialog pupo' id='notice_dialog'>
<div class='content'>
<div class='header'>
课题审批
</div>
<div class='body'>
<form action="project.php?mod=detail&do=doaddnotice" name="aj_notice" id="aj_notice" method="POST">
<table>
<tr>
<td>课题名称：</td><td>论武力的作用</td>
</tr>
<tr>
<td>公告类型</td>
<td>
<select name="ntype">
<option value=1> 组内公告 </option>
<option value=2> 全站公告 </option>
</select>
</td>
</tr>
<tr>
<td>公告内容：</td><td><textarea cols="50" rows="5" name="content" id="content"></textarea></td>
</tr>
</table>
<input type="hidden" name="pid" id="pid" value="<{$project.project_id}>">
</form>
</div>
<div class='footer'>
</div>
</div>
</div>
<!---------------------------------------------------------->
<script type="text/javascript">
//与原来的代码相比，这里又多引入了连个文件‘validation’和‘dd’，一个实现验证功能，一个实现拖动功能
KISSY.use("ua,node,overlay,button,validation,dd", function(S, UA, Node, O, Button, Validation, DD) {
var d = new O.Dialog({
srcNode: "#notice_dialog",
width: 400,
closable: false,//去除右上角的关闭符号"X"
elStyle:{
position: UA.ie == 6 ? "absolute" : "fixed"
},
align: {
points: ['cc', 'cc']//弹出层的位置，在浏览器正中央
},
effect: {
effect:"fade",//以渐进的效果显示弹出层,
duration:0.5
},
header:Node.one('.header'),
body:Node.one('.body'),
footer:Node.one('.footer'),
mask: true
});
// 生成两个按钮
var ok = new Button({
content: " 确 认 ",
render: d.get('footer'),
width:50,
elCls: 'my-button-cls',
tooltip: "点击发布公告"
});
var cancel = new Button({
content: " 关 闭 ",
render: d.get('footer'),
width:50,
elCls: 'my-button-cls',
tooltip: "点击关闭"
});
ok.render();//渲染确认按钮
cancel.render();//渲染关闭按钮
//验证必填项
var verifyform = new Validation('#aj_notice',{
style:"under"
});
verifyform.add("#content",{
length:[1,10] //限制公告内容的长度。此行注释掉后就只会判断是否填写。更多的配置项请查询KISSY API
});
Node.one('#addnotice').on('click', function(e) {//点击按钮触发
d.show();
});
ok.on("click",function(){//点击确认按钮触发
//判断必填项是否填写
var isValid = verifyform.isValid();
if(!isValid){
return false;
}
d.hide();
S.DOM.get('#aj_notice').submit();//这里就是点击确认后提交弹出层表单
});
cancel.on("click",function(){//点击关闭按钮触发
d.hide();
});
});
</script>
</body>
</html>
posted @ 2011-10-14 11:39 煋火 阅读(382) 评论(4) 编辑
摘要: 转载自：玉米串关于PHP的无限分类代码，网上已经有很多了，讲解的也很到位，在这里我分享一下我用着很顺手的一个。下面一段代码是创建相应数据库的sql代码： 1 ////////////// 2 //////无限分类的数据库设计及样例 3 ////////////// 4 mysql> create database db_kind; 5 Query OK, 1 row affected 6 7 mysql> use db_kind; 8 Database changed 9 mysql> create table tb_kind( 10 -> id int not ...阅读全文
posted @ 2011-10-13 14:04 煋火 阅读(434) 评论(0) 编辑
HTML5 发展如火如荼，随着各大浏览器对 HTML5 技术支持的不断完善以及 HTML5 技术的不断成熟，未来 HTML5 必将改变我们创建 Web 应用程序的方式。今天这篇文章向大家推荐 10 款优秀的 HTML5 开发工具，帮助你更高效的编写 HTML5 应用。
1. Initializr
Initializr 是制作 HTML5 网站最好的入门辅助工具，你可以使用提供的特色模板快速生成网站，也可以自定义，Initializr 会为你生成代码简洁的可定制的网页模板。
2. HTML5demos
想知道你的浏览器是否支持 HTML5 Canvas 吗？想知道 Safari 是否可以运行简单的 HTML5 聊天客户端吗？HTML5demos 会告诉你每一个 HTML5 特性在哪些浏览器中支持。
想了解 HTML5 的最新动向吗？使用 HTML5 Tracker 吧，它可以跟踪 HTML5 最新修订信息。
想要快速超找一个标签或者属性吗？看看这个非常酷的速查手册吧，每个 Web 开发人员的必备。
Switch To HTML5 是一个基础而有效模板生成工具。如果你开始一个新项目，可以到这里获取免费的 HTML5 网站模板。
HTML5 中的日历，取色板，滑块部件等都是非常棒工具，但是有些浏览器不支持。这个页面将帮助你构建完美的 HTML5 表单兼容方案。
7. HTML5 Test
你浏览器准备好迎接 HTML5 革命了吗？HTML5 Test 将告诉你。这个网站会为你当前使用的浏览器生成一份对 video、audio、canvas 等等特性的支持情况的完整报告。
Canvas 元素是 HTML5 最重要的元素之一，它可以在网页中绘制图形，非常强大。这是一个 Canvas 元素的详细速查手册。
9. Lime JS
LimeJS 是一个 HTML5 游戏开发框架，用于快速构建运行于触屏设备和桌面浏览器的游戏。非常棒，一定要用用试试。
10. HTML5 Reset
HTML5 Reset 是一组文件，包括 HTML、CSS 等，用于在开始新项目的时候帮助你节省时间，提供 HTML5 的空白 WordPress 模板。
posted @ 2011-10-10 12:41 煋火 阅读(19) 评论(0) 编辑
摘要: 今天，本文向大家展示19个基于 HTML5 和 CSS3 开发的优秀应用程序。HTML5可以说是近十年来 Web 标准最巨大的飞跃，它的使命是将 Web 带入一个成熟的应用平台，而 CSS3 同样给 WEB 开发带来了革命性的影响，以前很多需要JavaScript实现的复杂效果，现在使用简单的CSS3就能实现。一起看看这些优秀的应用示例。DeviantART MuroHootSuiteX-WorldsCSSWarpFlickr BrowserCSS3.0 MakerCoolendarTwimbowSketchpadCloudCanvasLislis PainterScribdGoogle Bo阅读全文
posted @ 2011-09-21 16:13 煋火 阅读(121) 评论(0) 编辑
摘要: 转载自：玉米串和http://www.cnblogs.com/best/archive/2011/09/05/2167817.htmlKISSY：小巧灵活、简洁实用、愉悦编码、快乐开发。KISSY的原则，确实如此。刚刚做了个注册页面，用到了KISSY的表单验证组件Validation。上例子：<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-阅读全文
posted @ 2011-09-05 23:45 煋火 阅读(175) 评论(1) 编辑
摘要: 今天分享下以前收藏的几个漂亮的后台WebUi框架，之前听人说到“一个项目最重要的是前台，后台谁看啊”，这话说的，是，领导是只看前台界面，但系统管理员呢？不能不说前台不重要，前台是很重要，但后台怎么能不重要呢，大部分数据要靠后台来输入，操作。如果一个好的后台界面，漂亮的，易用的页面对系统来说也很重要，如果你是系统管理员看到一个很草的后台，也会不爽吧，今天就给大家分享几套不错的后台框架，有源码下载。 打包下载，可用的模板转载自：http://www.cnblogs.com/xiaoyao2011/archive/2011/09/05/2167606.html阅读全文
posted @ 2011-09-05 23:32 煋火 阅读(491) 评论(0) 编辑
摘要: 最近开发了一段时间的chrome app，今将一些体会感想分享给大家（不是App开发基础教程）。 chrome开放了丰富的API，涵盖了浏览器的方方面面，其应用可以说“只有想不到，没有做不到”。然而，酒香也怕巷子深，单纯依赖chrome工具栏上的简单入口（Browser Actions, Page Actions）难以引起用户注意，如何让一个功能强大的扩展被用户很方便的使用起来，困扰了我很长时间。 经过一段时间的探索，总结了几种app入口方式 ，下面以webElements (网页元素查看器，提取页面图片、正文，尤其适合论坛看图，轻松阅读文章)为例，一一介绍。 入口一：工具栏Brows...阅读全文
posted @ 2011-09-04 09:59 煋火 阅读(66) 评论(0) 编辑
摘要: 22个带给你灵感的网页联系表单设计案例 联系表单是网站非常重要的一部分，访客通过联系表单和网站所有者取得联系，反馈信息。新颖的网页表单设计能吸引用户的注意力，让更多的用户填写反馈信息。这里收集22个优秀的网页联系表单设计案例，希望能带给您灵感。Reverend DangerTim BiskupInsiteKettleCory EtzkornGiftRocketCabedgeStudio Chirpymurray & murrayLoysel’s ToyheadlampGrowcaseChristia WwooPaperluxWhitespaceSelect PropertiesShaw阅读全文
posted @ 2011-09-03 00:18 煋火 阅读(209) 评论(0) 编辑
