当前位置 > 首页 > Archive: 九月 2009

IE6下，png透明最好的解决方案

九月 30, 2009 作者：  
类别：个人随笔

1 条评论|1478 views

透明png（准确的说是png-24）图片在网页上的应用，可以做出各种特效，使网页变得更加漂亮!

现在大部分浏览器都支持png透明，要命的IE6，却不支持！怎么办呢？从网上一搜，IE6下的png透明的解决方法有好多，自己以前也试过好多方法，有的只能背景透明，有的只能图片透 阅读全文

标签：, , ,

一步一步学习js，仿火星首页“今日推荐”

九月 28, 2009 作者：  
类别：个人随笔

发表评论|1116 views

看了《javascript高级程序设计》有一个多月了，感觉应该用js写个系统点的例子了，正好今天不太忙，就用js仿一下火星首页“今日推荐”模块吧。

样子如图所示：

hxsd

JavaScript代码如下：

Download script.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

var n = 0;
var imgs = new Array(9);
var path = "img/";
imgs[0]=path + "00.jpg";
imgs[1]=path + "01.jpg";
imgs[2]=path + "02.jpg";
imgs[3]=path + "03.jpg";
imgs[4]=path + "04.jpg";
imgs[5]=path + "05.jpg";
imgs[6]=path + "06.jpg";
imgs[7]=path + "07.jpg";
imgs[8]=path + "08.jpg";
function $(id){
	return typeof id == 'string' ? document.getElementById(id) : id;
}
var timer;
function showPic(){
	var myimg = $("myimg");
	var imglink = $("imglink");
	myimg.setAttribute("src",imgs[n]);
	var myul = $("myul").getElementsByTagName("li");
	var mylink = $("myul").getElementsByTagName("a");
	var links = mylink[n].getAttribute("href");
	var titles = mylink[n].getAttribute("title");
	imglink.setAttribute("href",links);
	imglink.setAttribute("alt",titles);
	for(i=0;i<myul.length;i++){
		myul[i].className = "none";
		mylink[i].className = "none";
	}
	myul[n].className = "hover";
	mylink[n].className = "hover";
	n++;
	if(n == 9) n = 0;
}
function shownow(){
	clearInterval(timer);showPic();
}
function showall(){
	timer = setInterval("showPic()",3000);
}
function init(){
	var mylink = $("myul").getElementsByTagName("a");
	for(var i = 0, iLen = mylink.length ; i < iLen ; i++)
	{
		mylink[i].loc = i;
		mylink[i].onmouseover = function(){
			n = this.loc;
			shownow();
		}
		mylink[i].onmouseout = function(){
		        showall();
		}
	}
}
timer = setInterval("showPic()",3000);
init();

全部代码如下：

（点击“运行”直接查看效果）

提示：你可以先修改部分代码再运行。

例子到此结束，在写的过程中麻烦了一位同事（兼js“老师”）帮助，很感谢他！

标签：, , ,

一步一步学习js，获取表单值

九月 27, 2009 作者：  
类别：个人随笔

发表评论|1393 views

获取表单值,并输出在相应的标签中

Download script.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

function $(id){
	return document.getElementById(id)
}
var fm = $("fm");
var Show = $("Show");
var Show2 = $("Show2");
var skill = $("skill");
function OutputText(){
	if(fm.content.value!=""){
		Show.innerHTML="您输入的内容是：<span>"+fm.content.value+"</span>";
	}else{
		Show.innerHTML="<em>您没有输入任何内容！</em>";
	}
}
var len = fm.skills.length;
function checkskill(){
	var bool=0;
	var thischecked = new Array();
	for (var i=0; i<len; i++){
		var e=fm.skills[i];
		if (e.checked){
			thischecked=thischecked+e.value+" ";
			Show2.innerHTML="您擅长:<span>"+thischecked+"</span>";
			bool++;
	   }
	}
	if(bool==0){
		Show2.innerHTML="<em>您没选择</em>";
	}
}
 
function checkAll() {
	for (var j = 0; j <= len; j++) {
		var e=fm.skills[j];
		if (e.checked == false) e.checked = true;
   }
}
 
function uncheckAll() {
	for (var j = 0; j <= len; j++) {
		var e=fm.skills[j];
		if (e.checked == true) e.checked = false;
   }
}
 
function switchAll() {
	for (var j = 0; j <= len; j++) {
		var e=fm.skills[j];
		e.checked = !e.checked;
	}
}

提示：你可以先修改部分代码再运行。

标签：,

一步一步学习js

九月 27, 2009 作者：  
类别：个人随笔

发表评论|173 views

以前做网页用到js都是从网上找类似的代码效果改一下，或借助一些框架。结果做了这么长时间，对js的了解还是很肤浅。早就买了《JavaScript高级程序设计》，当时只是潦草翻过一遍，仅限于能看懂一些别人的代码，自己写还是无从下手。

老这样可不行呀，于是下定决心，重新从 阅读全文

标签：,

探究IE6的几个奇怪的问题（一）

九月 24, 2009 作者：  
类别：个人随笔

发表评论|1250 views

前两天在做页面时发现了一个奇怪的问题，就是IE6在写列表时，如果给ul定了padding-top值以后，当li换到下一行时，ul上的padding-top值就会在第二行的li上生效，一开始我还以为在IE6中li继承了ul的padding之呢，但是不应该呀！

可能文字表达不好，直接上例子和截图吧。

问题的 阅读全文

标签：, , ,

第一次见用html5写的博客

九月 3, 2009 作者：  
类别：个人随笔

发表评论|1136 views

 

今天看到一个用HTML5写的博客，查看源代码，那华丽的html5结构，

html5

div标签被更加语义化的header、nav、section、footer所代替，减少了定义class的麻烦，明确了结构图，节省了代码，让人一看感觉很爽。

更强的是这位大哥屏蔽IE，在IE下只能看到

ie

（可能是因为IE对html5 阅读全文

标签：,