這是用什麼程式或腳本寫成的網頁？

哈啦 · #1 2006-01-01, 06:57 PM

剛看到有人介紹「愛牆」www.lovewall.net 這種可以讓人寫留言但表現方式卻像現實生活中的便利貼，這是用什麼東西寫成的？

中間的那些黃黃紅紅的方塊可以用滑鼠移動挪開。

而看他們的部落格中有說這個網站是「一个WEB2.0的典范，是在草根阶层兴起的年代出现的优秀网站」，請問什麼是WEB2.0？一定要這種WEB2.0才能有這種表現型態嗎？

哈啦 · #2 2006-01-01, 07:35 PM

找到一個有類似效果的java script，但只能出現一個方塊。
語法如下：

先在網頁的<head>和</head>之間插入這段文字：

HTML 代碼:

<style>
<!--

/*Post-it note script- by javascriptkit.com
Visit JavaScript Kit ([url]http://javascriptkit.com[/url]) for script
Credit must stay intact for use*/

#postit{
position:absolute;
width:250;
padding:5px;
background-color:lightgreen;
border:1px solid red;
visibility:hidden;
z-index:100;
cursor:hand;
}

-->
</style>

然後在網頁內容的<body>和</body>之間，最好是靠近底部以後比較好參考，放入這段文字：

HTML 代碼:

<div id="postit" style="left:150px;top:150px">
<div align="right"><b><a href="javascript:closeit()">[關閉]</a></b></div>

<!--INSERT YOUR CONTENT HERE-->

<b>便利貼:</b><br>
<p><font size="2" face="Arial"><a href="http://www.webmasterclub.org" target="_new">站長俱樂部<br>
</a>歡迎參加站長俱樂部論壇</font></p>
<p><font size="2" face="Arial"><a href="http://www.domainclub.org" target="_new">網域名稱俱樂部<br>
</a>網域名稱買賣、交易、評估等討論。</font></p>

<!--END YOUR CONTENT HERE-->

</div>

<script>

//Post-it only once per browser session? (0=no, 1=yes)
//Specifying 0 will cause postit to display every time page is loaded
var once_per_browser=0

///No need to edit beyond here///

var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ns4)
crossobj=document.layers.postit
else if (ie4||ns6)
crossobj=ns6? document.getElementById("postit") : document.all.postit


function closeit(){
if (ie4||ns6)
crossobj.style.visibility="hidden"
else if (ns4)
crossobj.visibility="hide"
}

function get_cookie(Name) {
  var search = Name + "="
  var returnvalue = "";
  if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) { // if cookie exists
      offset += search.length
      // set index of beginning of value
      end = document.cookie.indexOf(";", offset);
      // set index of end of cookie value
      if (end == -1)
         end = document.cookie.length;
      returnvalue=unescape(document.cookie.substring(offset, end))
      }
   }
  return returnvalue;
}

function showornot(){
if (get_cookie('postdisplay')==''){
showit()
document.cookie="postdisplay=yes"
}
}

function showit(){
if (ie4||ns6)
crossobj.style.visibility="visible"
else if (ns4)
crossobj.visibility="show"
}

if (once_per_browser)
showornot()
else
showit()

</script>

<script language="JavaScript1.2">

//drag drop function for ie4+ and NS6////
/////////////////////////////////

function drag_drop(e){
if (ie4&&dragapproved){
crossobj.style.left=tempx+event.clientX-offsetx
crossobj.style.top=tempy+event.clientY-offsety
return false
}
else if (ns6&&dragapproved){
crossobj.style.left=tempx+e.clientX-offsetx
crossobj.style.top=tempy+e.clientY-offsety
return false
}
}

function initializedrag(e){
if (ie4&&event.srcElement.id=="postit"||ns6&&e.target.id=="postit"){
offsetx=ie4? event.clientX : e.clientX
offsety=ie4? event.clientY : e.clientY

tempx=parseInt(crossobj.style.left)
tempy=parseInt(crossobj.style.top)

dragapproved=true
document.onmousemove=drag_drop
}
}
document.onmousedown=initializedrag
document.onmouseup=new Function("dragapproved=false")

</script>

steven · #3 2006-01-01, 10:49 PM

這個idea真棒.....令我大大讚賞....

哈啦 · #4 2006-01-02, 12:27 AM

引用:

作者: steven

這個idea真棒.....令我大大讚賞....

如果這真是大陸人原創的點子，那只能說大陸未來在網路世界的產業將無法令人小覷。
其實從「老鼠愛大米」這樣風格的歌曲流行到台灣後，就顯示了大陸的許多文化創意將逐漸抬頭而且不斷壯大，總有一天覆蓋過原本走在「流行」尖端的香港和台灣。我覺得電腦和網路上的影響力會更快。

報馬仔 · #5 2006-01-02, 07:10 PM

引用:

作者: 哈啦

請問什麼是WEB2.0？一定要這種WEB2.0才能有這種表現型態嗎？

Web 2.0的時代來臨
BEA技術經理蕭百齡
29/10/2003
原文網址 : http://taiwan.cnet.com/enterprise/co...0084802,00.htm

上週我們談到Web services是服務導向架構 (SOA; Service-Oriented Architecture)的血肉；而正確的設計觀念和周詳的導入規劃則是SOA 的靈魂。如果只是趕時髦、為Web services而Web services，無法掌握導入的精髓，那麼充其量也只不過是具行屍走肉罷了，更別說能夠為整體IT帶來多大的助益（搞不好會適得其反）。

上次談到科技發展的兩個曲線–炒作曲線和導入曲線。這次我想從其他的層面來看Web services觀念的起源、發展所處的階段，以及技術上所覆蓋的層面。

1994 年網頁瀏覽器的出現，迅速地讓World-Wide Web在短短的幾年間，首度達到前所未有，一個真正橫跨全世界的超級資訊庫，所有的文件都遵照相同的格式提供出來，並相互串聯。

如果我們從技術的角度探究Web之所以能成功，會發現遵循開放標準所帶來的鬆散藕合(loose coupling)是最重要的關鍵。怎麼說？站在一個使用者的立場，我只要有一個瀏覽器，不管是用什麼平台--PC、Unix、Mac，甚至是PDA，我都可以看遍全世界的網站。或許我明天會挖掘出幾個之前從來沒去過、令人興奮的新網站。

最棒的是，我的電腦和瀏覽器事先不用和那些新的網站先進行設定，只要想連結到哪個網站去就隨時可以去。更神奇的是，瀏覽器（資訊消費者）和網站（資訊生產／服務提供者）雙方不會因為各自不定期，或者是定期的升級、改版動作而影響彼此的連結與資訊的擷取。這就像燈泡、電池一樣，可自由選擇不同廠牌，來搭配不同的檯燈和手電筒。而Web之所以能成功，正是因為大家--也就是各廠牌的瀏覽器和網頁伺服器--基本上都遵循HTML、JPG，HTTP 這些開放格式和標準。但如果用到某瀏覽器或伺服器專屬的功能時，開放性和選擇性就會受到扼殺。

隨著網站的迅速普及，除了用網頁來提供內容和資訊外，很快的，網站也變成了資料庫查詢、線上交易等各形各色的服務提供者。網站伺服器 (Web server) 同時也開始被賦予要執行應用程式的任務。當這些任務變得愈來愈重要、艱鉅且專業時，應用伺服器 (application server) 便應運而生，時至今日，發展已趨於成熟。

我們可以把這一波的網路革命--使用者藉由瀏覽器作為窗口，享受到網站所提供的各項應用服--稱做是Web 1.0的時代。而「browser to AP」可說是這個時代不二的運行模式。

幾年前，網路上的有識之士開始思考：為什麼要那麼僵硬的侷限大家，一定要透過瀏覽器才能來執行網站上的應用、享受所提供各項服務？是不是可以讓資訊服務的消費者和生產者之間更「鬆散藕合」一點；換句話說，網站上的應用程式在提供各項服務時，是不是可以不要將交易和查詢的結果立即format成HTML網頁的格式？

因為這樣一來，就等於對資訊的消費端預設了一個立場，變成強迫消費端非得要用瀏覽器來與資訊供應端互動。是不是能有一個更中立的方式，讓消費端自行決定要如何消化、呈現從服務端所提供的資訊？XML正是在這樣的背景下誕生，其目的即在於提供一個對資訊能夠做精準描述的機制，藉以彌補 HTML 太過於表現導向的特質。

在這樣的情況下，消費端的應用彈性便大幅增進。生產端應用伺服器所提供出來的資訊「服務」，除了瀏覽器外，還有包含IM (Instant Messenger) 在內的P2P軟體、Java手機、IA 家電，乃至於其他伺服器上的服務程式。而Office類的文書軟體，也都搖身一變為潛在的資訊消費者。Web 的運行模式，也從之前的 Web 1.0 --「browser to AP」，演化到「AP to AP」的 Web 2.0 時代。而「Web services」這個名詞被選擇用來代表這個新的應用模式。

Web 1.0 時代為因應需求所衍生的應用伺服器，在Web 2.0 時代也逐漸開始演化為服務導向的應用平台。在後續的專欄中，將會進一步的討論到這個主題。

再來看看 Web services 發展至今，已經受到廣泛探討和研發的各個技術層面。我們用真實世界中的服務來對照，會發現Web services和SOA 中所強調的「服務」，在觀念上有許多地方的確有如前兩期中所言，與業務面非常貼近。

就以日常生活中常接觸到的郵局、銀行，監理所等的服務櫃檯來說，我們在臨櫃申辦之前，可以先在服務台查詢服務說明、服務項目，然後得找到正確的申辦窗口。至於申辦前，也必須先按規定先填單子，照欄位格式一項項的填寫，還必須出具印鑑、身分證等驗明正身，然後交給承辦人員辦理。當業務繁忙、排隊的人多的時候，可能會有義工或專人引導我們到比較不忙的窗口去申辦，以加快處理速度。服務的品質；也可能會受到服務主管的監聽和紀錄（像我們打電話到客服中心去，就常常被告知說，為確保服務品質，這通電話可能受到監聽）。

這些和服務相關的各項功能，在Web services和SOA的領域中，也都一一有相對應的機制，包括UDDI和 WSDL（服務查詢和描述）、service endpoint（申辦窗口）、XML Schema/XSD（申請單格式）、WS-Security（驗明正身）、SOAP（申辦動作），此外還有服務繞徑／路由和負載平衡（申辦排隊的引導）、服務監控、管理、稽核，以及品質的確保。

所有這些 Web services 的相關領域，目前都已經有專門的產品提供解決方案。在設計規劃 Web services 和服務導向架構時，負責的建築師也可以利用這些與真實世界業務相仿的特性，來協助鑑定所規劃的 IT 服務，同時應與使用單位進行充分的溝通。而此舉對成功的導入，將有相當的助益。

idea · #6 2006-01-23, 10:07 AM

，

看见大家在讨论技术问题，参与一下，我开发了www.lovewall.cn , 这个动态的脚本谁需要大家可以发邮件给我，我寄给大家，这个脚本可以支持文字（就是那些小纸条），图片，flash的的移动，最主要的还是支持在ff中的正常显示。其实这个不能算是很复杂，也没有用ajax等技术。

希望和大家可以经常讨论技术问题。

我的邮件， idea@lovewall.org ，来自北京，爱墙.中国，

在中国人的春节，请大家到www.lovewall.cn上发布自己的心愿。谢谢。