图片超过大小自动缩放代码

2008年1月22日 雨无形 没有评论

以下是网页中图片超过指定大小自动缩放，并且可以点击看大图的代码

[CODE=javascript] //改变图片大小 function resizeImg() { var contentwidth=565;//设置图片最大宽度 var imageAll=document.getElementById("con").getElementsByTagName("img");//con为图片所在层的ID var turewidth,tureheight; if (imageAll !=null) { for (i=0; iimageAll[i].width) { if(imageAll[i].height==tureheight) { imageAll[i].style.height=imageAll[i].height/turewidth*imageAll[i].width+"px"; } imageAll[i].onclick=function(){window.open(this.src)}; imageAll[i].style.cursor="pointer"; imageAll[i].title="点击查看原始尺寸："+turewidth+"*"+tureheight+"px"; } else { imageAll[i].style.width=turewidth+"px"; } } } } if (window.addEventListener) window.addEventListener("load", resizeImg, false); else if (window.attachEvent) window.attachEvent("onload", resizeImg); else window.onload=resizeImg [/CODE]

分类: JavaScript, 网页设计 标签:

由修改漂浮广告代码而学到的DOCTYPE声明对JS的影响

2008年1月21日 雨无形 没有评论

经常有些JS代码明明在别人网页上可以运行，拷贝过来运行却出错，这个时候可以检查下是不是DOCTYPE声明的问题

在没有DOCTYPE声明的情况下:

document.body.clientWidth

document.body.clientHeight

为当前窗口的宽度/高度;

在DOCTYPE声明以后

document.body.clientWidth

document.body.clientHeight

为整个页面的宽度/高度;

document.documentElement.clientWidth

document.documentElement.clientHeight

为当前窗口的宽度/高度;

同样增加DOCTYPE声明后

document.body.scrollLeft

document.body.scrollTop

要改为

document.documentElement.scrollLeft

document.documentElement.scrollTop

分类: JavaScript, 网页设计 标签: ,

我修改的,支持FF和IE的漂浮广告代码

2008年1月21日 雨无形 没有评论

网上搜索的一段代码,但是加上DOCTYPE后就不能用了,于是乎修改了一下,现在完美支持FF和IE

JS代码如下：

 
  1. var img = document.getElementById("img");   
  2. var xPos = 20;   
  3. var yPos = document.documentElement.clientWidth - img.offsetHeight;   
  4. var step = 1;   
  5. var delay = 5;   
  6. var height = 0;   
  7. var Hoffset = 0;   
  8. var Woffset = 0;   
  9. var yon = 0;   
  10. var xon = 0;   
  11. var pause = true;   
  12. var interval;   
  13. img.style.top = yPos + "px";   
  14. function changePos() {   
  15. width = document.documentElement.clientWidth;   
  16. height = document.documentElement.clientHeight;   
  17. Hoffset = img.offsetHeight;   
  18. Woffset = img.offsetWidth;   
  19. img.style.left = xPos + document.documentElement.scrollLeft + "px";   
  20. img.style.top = yPos + document.documentElement.scrollTop + "px";   
  21. if (yon) {   
  22. yPos = yPos + step;   
  23. } else {   
  24. yPos = yPos - step;   
  25. }   
  26. if (yPos < 0) {   
  27. yon = 1;   
  28. yPos = 0;   
  29. }   
  30. if (yPos >= (height - Hoffset)) {   
  31. yon = 0;   
  32. yPos = (height - Hoffset);   
  33. }   
  34. if (xon) {   
  35. xPos = xPos + step;   
  36. }   
  37. else {   
  38. xPos = xPos - step;   
  39. }   
  40. if (xPos < 0) {   
  41. xon = 1;   
  42. xPos = 0;   
  43. }   
  44. if (xPos >= (width - Woffset)) {   
  45. xon = 0;   
  46. xPos = (width - Woffset);   
  47. }   
  48. }   
  49. function start() {   
  50. img.visibility = "visible";   
  51. interval = setInterval(‘changePos()’, delay);   
  52. }   
  53. start();  

 

分类: 网页设计 标签: , ,