Archive for January, 2006

Pages (7): « First ... « 2 3 4 5 6 7 »

浏览器对网页标准支持对比表

Jan 7, 2006 Author: | Filed under: Uncategorized

http://nanobox.chipx86.com/browser_support.php

对网页标准(Web Standars)各种浏览器对比。后面这个是简表，看起来更直观一些。红色表示不好（不支持），绿色表示好（支持），大致可以看出 opera firefox 对网页标准支持较好，个人感觉 opera 要更好一点。IE？…：（

0 Comments

javascript to be learn

Jan 7, 2006 Author: | Filed under: Uncategorized

location.hash and addEventListener

http://virtuelvis.com/gallery/css3/target/interface.html

movement.js

var capX, capY; var capture = false; function init(){ d = document.getElementsByTagName(’div’); // Set up event listener for mouseover on the viewport. document.getElementsByTagName(’html’)[0].addEventListener(”mousemove”,doMove,true); for (i = 0; i < d.length; i++){ if (d[i].className == "window") { // add event listener for when you mouse down over a window. d[i].addEventListener("mousedown",eFocus,false); // Event listener for mousedown on a "window" header. To enable dragging. d[i].getElementsByTagName('h2')[0].addEventListener("mousedown",startMove,false); // Event listener to release window move. d[i].getElementsByTagName('h2')[0].addEventListener("mouseup",endMove,false); } } } function eFocus(ev){ // Give focus to a window when it is clicked. m = ev.currentTarget; window.location.hash = m.id; return false; } function startMove(ev){ // Enable window dragging. var m = ev.currentTarget.parentNode; // Find the offset values, so that the window doesn't // "jump" when moved if (!capX){ capX = ev.clientX - m.offsetLeft; } if (!capY){ capY = ev.clientY - m.offsetTop; } capture = ev.currentTarget.parentNode; return true; } function endMove(ev){ // End window dragging capX = false; capY = false; capture = false; return true; } function doMove(ev){ // If the startMove has enabled capture, this window // will enable moving of windows. if (capture){ var m = ev.currentTarget; capture.style.left = (ev.clientX - capX)+"px"; capture.style.top = (ev.clientY - capY)+"px"; } } window.onload = init; 显示更多

Running scripts as soon as possible

http://userjs.org/help/tips_and_tricks/runnung-scripts-early

[Edit on 2006-1-7 10:29:55 By guoshuang]

0 Comments

用 oprea 自定义脚本显示纯文本文件中的URL

Jan 7, 2006 Author: | Filed under: Uncategorized

下载这个 linkify-txt.js，保存到某个目录中（最好在opera相关目录中），然后在 opera 的 tools - preferences - Content - Javascript options - My javascript file 中选择（或者输入）这个js文件的完整路径。

打开这个测试文本，你会看到文本中的链接（http ftp）被加入了链接，注意，这可是纯文本，只是在用opera浏览的时候被处理成了html。

注意：pera 8 版本需要在 opera6.ini 中在 [User Prefs] 后面加入

Always Load User JavaScript=1

我用的是 opera 9 beta 不需要。opera 自定义脚本就象 firefox 下的 greasemonkey。也许应该反过来说，greasemonkey 的想法正是来自 opera my javascript file 的启发。

更多说明在：Linkify text files

[Edit on 2006-1-7 10:12:32 By guoshuang]

0 Comments

检测 opera 当前页面缩放的javascript代码

Jan 7, 2006 Author: | Filed under: Uncategorized

只对 opera有效，偷偷在浏览器显示区域之外放一个 div 然后 setInterval 计算其缩放比例。其中没有使用 innerHTML 或者 document.write 而使用 createElement 的方法（对 strict XHTML）也值得学习。

BTW:opera 缩放快捷键是 + - *(恢复原大)，firefox 多一个 Ctrl 键。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> html { background: #f7f7f7; } body { background: white; padding: 0.5em; width: 45em; max-width: 80%; margin: 5em auto; border: 1px solid black; font-family: "Bitstream Vera Sans", Arial, sans-serif; } body p { padding: 0; margin: 0 0 1.5em 0; } .notCompatible { color: red; } body h1 { font-size: 1.2em; margin: 0; padding: 0; } </style> <script type="text/javascript"> window.onload = function(){ this.lastHeight, this.lastWidth; var self=this; this.measureZoom = function(){ var s = document.getElementById("ozMeasure"); s.style="display:block;position:fixed;left:-65536px;top:0;height:100%;z-index:-32"; if (self.lastHeight != s.offsetHeight){ var zoom = window.innerHeight/s.offsetHeight; document.getElementById("oZoomlevel").style.fontSize = (2/zoom)+"em"; document.getElementById("oZoomlevel").style.left = (0.5/zoom)+"em"; document.body.style.marginTop = (5/zoom)+"em"; var zoom_correction = Math.round(zoom*100)%10; if (zoom_correction > 5){ zoom = Math.round(zoom*100)+(10-zoom_correction); } else { zoom = Math.round(zoom*100)-(zoom_correction); } document.getElementById("oZoomlevel").innerHTML="Zoom level: "+zoom; } // s.style="display:none;" self.lastHeight = s.offsetHeight; } if(window.opera){ var d = document.createElement("div"); d.id="ozMeasure"; d.style="position:fixed;left:-100px;top:0;height:100%;width:1px"; document.documentElement.appendChild(d); var p = document.createElement("p"); p.id = "oZoomlevel"; p.style="position:fixed;top:0;margin:0"; document.body.appendChild(p); f = setInterval(this.measureZoom,54); } else { var p = document.createElement("p"); p.innerHTML="This demo requires the Opera web browser to work. "; p.className = "notCompatible"; var l = document.createElement("a"); l.innerHTML="Download Opera!"; l.href="http://www.opera.com"; p.appendChild(l); document.body.insertBefore(p,document.getElementsByTagName('noscript')[0]); } } </script> </head> <body> <h1>Zoom level demo</h1> <noscript> This demo requires that you are using the Opera browser, and that JavaScript is enabled. If you are using Opera, please enable JavaScript. </noscript> The Opera browser has a unique feature in that it allows full-page zoom, where you zoom both images and text, as opposed to most other browsers’ text size feature. Users of the Opera web browser should be seeing a zoom indicator in the upper left corner of the screen that displays the current zoom level, and it should remain roughly the same size as you resize the page. The presented result is fairly accurate when the zoom levels are not to extreme, but as you zoom in, the precision is ultimately limited by two factors: Window size and float precision. With a browser window running full-screen on 640×480, the first erronous result appears when zoom level is 500%, when the calculation returns 520%, at 1024×768, the first error appears at 660%, where the calculation returns 650%. This demonstration is attached to the weblog entry <a href="http://virtuelvis.com/archives/2005/05/opera-measure-zoom">How to detect zoom in Opera</a>. </body> </html> 运行代码 [Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]