Subscribe

RSS Feed (xml)

Powered By

Skin Design:
Free Blogger Skins

Powered by Blogger

顯示具有 程式語言-Javascript 標籤的文章。 顯示所有文章
顯示具有 程式語言-Javascript 標籤的文章。 顯示所有文章

2011年5月14日 星期六

How To Create Your Own Chrome Web Apps

http://www.vikitech.com/2398/create-chrome-web-apps

http://code.google.com/intl/zh-TW/chrome/webstore/docs/get_started_simple.html#step6

http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3900056

2011年5月2日 星期一

MSNIM

http://blog.sina.com.tw/hsinchen/article.php?pbgid=35858&entryid=305230
http://msdn.microsoft.com/en-us/library/aa689857(v=vs.71).aspx

msnim
http://blog.apao.idv.tw/read.php/176.htm

http://www.tech-recipes.com/rx/1157/msn-messenger-msnim-hyperlink-command-codes/

2011年4月11日 星期一

ajax

http://miniajax.com/
1. Lightbox2, (http://www.huddletogether.com)

可以用在目前的頁面上覆蓋一層圖片,類似相簿列表以及開啟之後的功能。Lightbox2使用prototype framework跟Scriptaculous特效庫。

2.Timeline (http://simile.mit.edu/timeline/)

看到plurk在用的Timeline技術很炫也很想使用嗎?這個Timeline就是你的最佳選擇。它使用單純的Ajax和DHTML來開發。

3.Reflection.js(http://cow.neondragon.net)

Reflection可以用來產生圖片的倒影圖,類似影像在靜態的水中或是清潔的磁磚上反射的成像。過去這種成像必須要靠Javaapplet或是Flash完成,現在只要靠簡單的Javascript就可以做到。

4.Pie & Donut Chart (http://www.amcharts.com/pie/)

用來產生圓餅圖和甜甜圈圖的工具,不過這跟之前的幾個不太一樣,他其實是Flash。

5.Plotr (http://solutoire.com/plotr/)

Plotr跟Pie & Donut Chart來比是一個比輕量級的統計圖表產生工具,他用的Javascript Library是比較少見的Mochikit。

6.Ajax Instant Messenger (http://www.ajaxim.com/)

這個東西很炫,而且想必是很多Web Application都很想要用的工具,它利用Ajax技術在頁面上創造一個不需要更新頁面的即時通訊工具。這個東西的技術並不會太難,但是卻相當實用。

7.Starbox (http://www.nickstakenburg.com/projects/starbox/)

Starbox讓你只用一張PNG圖片就可以創造各種星等評價頁面,它用的也是prototype framwork。

8. Ajax Tabs Content (http://www.dynamicdrive.com/)

Ajax的頁籤式瀏覽條,只要套用div以及css就可以創造出各種不同樣式的頁籤,它用的只是單純的javascript和ajax。

9.Drag and Drop Shopping (http://demo.script.aculo.us/shop)

購物網站的最愛,它替使用者創造一個拖曳式的購物車,提供使用者完全不同的操作體驗。使用的是一般的Ajax技術。

10. Progress Bar (http://www.webappers.com/progressBar/)

一個相當有風格的進度條,使用Ajax。

11. Thick Box (http://jquery.com/demo/thickbox/)

這是一個相當實用的工具,跟第一項所介紹的Lightbox有點類似,它可以在目前頁面上開啟一個新的對話盒,對話盒內可以放任何圖片、Flash檔、或者是一般的HTML。

它用的Javascript framwork是jQuery,這也是今天所介紹到第一個用jQuery的工具。

12. Create Flickr Like Fields (http://dbachrach.com)

建立一個跟Flickr編輯元件類似的頁面物件,如果不清楚這是甚麼的話,這裡有範例。

13. jTip – A jQuery Tool Tip (http://codylindley.com)

可以用來產生tool tip的工具,用的是jQuery Framework,這裡有範例。

14.Accordian (http://demos.mootools.net/Accordion)

可以用來產生折疊頁面資料特效的Javascript,它用的是另一個相當有名的Javascript framework, mootools。

15.Unobtrusive AJAX Star Rating Bar (http://www.masugadesign.com)

這也是用來產生星等評價頁面的工具,不過它還包含了後端的Server-side script PHP,效果類似Amazon上的評價方式。

2011年4月7日 星期四

20 Fresh JavaScript Data Visualization Libraries

20 Fresh JavaScript Data Visualization Libraries
http://sixrevisions.com/javascript/20-fresh-javascript-data-visualization-libraries/

Making Our Own Twitter Timeline
http://tutorialzine.com/2009/09/making-our-own-twitter-timeline/

2011年3月23日 星期三

Get URL Parameters Using Javascript

http://www.netlobo.com/url_query_string_javascript.html


function gup( name )
{
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
return "";
else
return results[1];
}


http://www.foo.com/index.html?bob=123&frank=321&tom=213#top


var frank_param = gup( 'frank' );

2011年3月1日 星期二

Google API]利用GFslideShow播放Picasa網路相簿中的圖片

Google API]利用GFslideShow播放Picasa網路相簿中的圖片

http://cire.pixnet.net/blog/post/28770294

Lightbox2

Lightbox2
http://www.huddletogether.com/projects/lightbox2/

jQuery lightBox plugin
http://leandrovieira.com/projects/jquery/lightbox/

Animated JavaScript Slideshow

Animated JavaScript Slideshow
http://www.scriptiny.com/2008/12/javascript-slideshow/


http://www.javascriptkit.com/howto/show3.shtml

2011年2月20日 星期日

撰寫跑馬燈/廣告輪播的好工具:jQuery Cycle Plugin

撰寫跑馬燈/廣告輪播的好工具:jQuery Cycle Plugin
http://blog.miniasp.com/post/2008/08/Writing-Marquee-and-Banner-Rotate-with-jQuery-Cycle-Plugin.aspx

jQuery教學-淡入淡出的廣告輪播器
http://www.minwt.com/?p=1984

[JS]酷炫ContentFlow相片特效直接套用
http://www.minwt.com/?p=2614

[jQ]用 jQuery 做廣告 - 左右水平廣告輪播
http://abgne.tw/jquery/apply-jquery/jquery-left-and-right-horizontal-ad.html

[jQ]Autotab 1.1b
http://abgne.tw/jquery/jquery-plugins/autotab-1-1b.html

http://www.bannerch.org.tw/slide/index.htm

http://www.css88.com/demo/ADSlide/index2.html

http://8888.pumo.com.tw/gate/gb/www.minwt.com/?p=1984

http://chan15.blogspot.com/2010/01/blog-post_29.html

JQuery 滑鼠移動到圖片上,圖片就放大的 plugin
http://blog.xuite.net/mp600.fh/skill/37292980

15 jQuery slideshow/gallery plugins
http://www.webanddesigners.com/15-jquery-slideshow-and-plugins

廣告輪播
http://www.cssrain.cn/demo/jQueryImgLoad/Demo1/demo2.html

放大鏡
http://www.111cn.net/wy/jquery/35207.htm
http://g.111cn.cn/javascript/js/20100918/jqb/

酷酷的jQuery鼠标悬停图片放大切换显示效果
http://www.zhangxinxu.com/wordpress/?p=474
http://www.zhangxinxu.com/study/200912/jquery-pic-hover-large.html

2010年12月19日 星期日

jquery 有關程式

http://demonstration.abgne.tw/jquery/plugins/0077/0077.html#
http://demonstration.abgne.tw/jquery/plugins/0079/0079.html
http://abgne.tw/jquery/jquery-plugins/3d-tag-sphere-0-3.html
http://abgne.tw/jquery/jquery-plugins/jquery-checkbox-1-3-0-beta-1.html
http://demonstration.abgne.tw/jquery/plugins/0081/0081.html
http://demonstration.abgne.tw/jquery/plugins/0072/0072.html
http://abgne.tw/jquery/jquery-plugins/jquery-alphanumeric-0-1-1.html
http://abgne.tw/jquery/jquery-plugins/limit-1-2.html
http://abgne.tw/jquery/jquery-plugins/watermark-1-0.html
http://abgne.tw/jquery/jquery-plugins/jquery-custom-check-box-and-radio-buttons-1-0-4.html
http://abgne.tw/jquery/jquery-plugins/autotab-1-1b.html
http://abgne.tw/jquery/jquery-plugins/masked-input-1-2-2.html
http://abgne.tw/jquery/jquery-plugins/prettycheckboxes-1-1.html
http://abgne.tw/jquery/jquery-plugins/vtip-v2.html
http://abgne.tw/jquery/jquery-plugins/jquery-ajax-rater-plugin-1-0.html
http://abgne.tw/jquery/jquery-plugins/contextmenu-r2.html
http://abgne.tw/jquery/jquery-plugins/center-element-plugin-1-1-2.html
http://abgne.tw/jquery/jquery-plugins/html-truncator-1-0-1.html
http://abgne.tw/jquery/jquery-plugins/jsuggest-1-0.html
http://abgne.tw/jquery/jquery-plugins/jqgalscroll-2-1.html
http://abgne.tw/jquery/jquery-plugins/table-resizer-0-1.html
http://abgne.tw/jquery/jquery-plugins/simple-color-picker-1-0.html
http://abgne.tw/jquery/jquery-plugins/jget-1-0.html
http://abgne.tw/jquery/jquery-plugins/file-styled.html
http://abgne.tw/jquery/jquery-plugins/jgrow-0-3.html
http://abgne.tw/jquery/jquery-plugins/checkbox-shiftclick-1-0.html

更改醜醜的upload button
File Styled
http://demonstration.abgne.tw/jquery/plugins/0003/0003.html

2010年10月7日 星期四

javascript語法之複製到剪貼簿(支援FireFox)

偶然因為專案需要,找了一下相關的script,覺得還不錯,發現自
http://blog.yam.com/visioncan/article/13183608

<script type="text/javascript">
function copyToClipboard(txt) {
     if(window.clipboardData) {
             window.clipboardData.clearData();
             window.clipboardData.setData("Text", txt);
     } else if(navigator.userAgent.indexOf("Opera") != -1) {
          window.location = txt;
     } else if (window.netscape) {
          try {
               netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
          } catch (e) {
               alert("被瀏覽器拒絕!\n請在瀏覽器地址欄輸入'about:config'並回車\n然後將'signed.applets.codebase_principal_support'設置為'true'");
          }
          var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
          if (!clip)
               return;
          var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
          if (!trans)
               return;
          trans.addDataFlavor('text/unicode');
          var str = new Object();
          var len = new Object();
          var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
          var copytext = txt;
          str.data = copytext;
          trans.setTransferData("text/unicode",str,copytext.length*2);
          var clipid = Components.interfaces.nsIClipboard;
          if (!clip)
               return false;
          clip.setData(trans,null,clipid.kGlobalClipboard);
     }
     alert('已經複製');
}
</script>
<textarea id="test">複製的文字</textarea>
<button onclick="copyToClipboard(test.value);">複製</button>