Posts Tagged ‘html’

直接使用网页进行打印

Posted in 前端技术 on 九月 14th, 2010 by admin – Be the first to comment

网页打印内容有很多便利的地方，而且不需要安装其他软件

会打印机页眉与页脚并且在有些在程序中不好去掉.

<!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" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title></title>

	<style type="text/css" media="print">
		*{margin:0; padding:0;}
		p{ background-color:#333; color:#fff; margin:1mm;}
		.page-break-after{page-break-after : always}
		button{display:none;}
	</style>
	<script type="text/javascript">
	function webprint(){
		window.print();
	}
	</script>
</head>
<body>
	<p>1</p>
	<div class="page-break-after">&nbsp;</div>
	<p>2</p>
	<div class="page-break-after">&nbsp;</div>
	<p>3</p>
	<button onclick="webprint()">print</button>

</body>
</html>

用a模拟submit按钮事件

Posted in 默认分类 on 九月 2nd, 2010 by admin – Be the first to comment

优点：样式可控制性强，可以加不同的状态，兼容ie6. 可扩展性好

缺点: 需要增加js，如果禁用ＪＳ可能不能使用.  需要多增加一个a标签。






提交提交

如果直接隐藏在from 中有多个表单无件时无效，求解 


.btn_a_submit{ position:absolute; left:-1000px; top:0px;}

通过script标签增加JS

Posted in 前端技术 on 二月 21st, 2010 by admin – Be the first to comment

工作需要在前端的代码通过xxx.js?m=m&x=x 的方法来通过js加载JS文件。

JS:

//MS闭包，不让代码互相影响，我也用的不多
(function(){

	var simcn = {
		src:[],
		init:function(){
			var __g = document.getElementById('simcnworkframe');
			this.srcUrl(__g.src);
		},
		run:function(){
			this.init();
			var head = document.getElementsByTagName('head')[0];
			var j=0;
			for(i in this.src){
				var t = document.createElement('script');
				t.src = this.src[i] + '.js' ;
				t.id  = "simc_" + this.src[i];
				head.appendChild(t);
			}
		},
		srcUrl:function(_u){
			var jl = _u.split('.js?')[1].split('&');
			for(i in jl){
				this.src.push(jl[i].split('=')[1]);
			}
		}
	};	

	simcn.run();

})()

//m.js
alert('m.js')

//c.js
alert('c.js')

//v.js
alert('v.js')

今天写的一个练习的js类模式

Posted in 默认分类 on 六月 10th, 2009 by admin – Be the first to comment 
suspendcode="
’关闭对联广告’
"
document.write(suspendcode);

var hp = {

lastScrollY : 0, 

byID : function(_id){ return document.getElementById(_id);},

init : function(id){
var st = document.documentElement.scrollTop || document.body.scrollTop;
percent=.1*(st-this.lastScrollY);
if(percent>0){
percent=Math.ceil(percent);
}else{
percent=Math.floor(percent);
}

this.byID(id).style.top=parseInt(this.byID(id).style.top)+percent+"px";
this.lastScrollY=this.lastScrollY+percent;
return id;
},

generate : function(){

},

start : function(id){
window.setInterval("hp.init(’"+id+"’)",1);
} 

}; 

#hp.start(’lovexin1′);

让ul与li水平居中，常用于页面居中导航

Posted in 前端技术 on 十月 14th, 2008 by admin – Be the first to comment

<html xmlns=”http://www.w3.org/1999/xhtml“>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>无标题文档-SH!</title>
<style>
ul,li{
margin:0;
padding:0;
list-style:none;
}
#area{
width:100%;
height:80px;
background-color:#eee;
text-align:center;
overflow:hidden;
}
#area ul{
float:left;
position:relative;
left:50%;
}
#area ul li{
float:left;
margin:10px;
padding:0 10px;
position:relative;
right:50%;
line-height:60px;
border:solid 1px #000;
}
</style>
</head>
<body>
<h1>跨浏览器实现float:center</h1>
<div id=”area”>
<ul >
<li>列表一,我是浮动的</li>
<li>列表二</li>
<li>列表三</li>
<li>这里可能是N</li>
</ul>
</div>
</body>
</html>