Google Chrome 瀏覽器開啟新分頁 (轉)

Google Chrome 瀏覽器開啟新分頁

在一般瀏覽器以Javascript設計開啟新視窗,
使用 window.open( url , "windown_name", "視窗狀態列設定"); 就可達成,
但在 Google Chrome 瀏覽器卻失效( Google Chrome Default 是自動阻擋新視窗)



但可開啟新分頁, 只要調整 javascript 語法即可

 var newwin = window.open();   //此行一定要如此書寫,否則失效
 newwin.location= url;   // url是 cgi 程式或者超連結 html

轉載於 http://jazz-info.blogspot.tw/2012/07/google-chrome.html

繼續閱讀 >

Google Chrome 瀏覽器開啟新分頁 (轉)

Google Chrome 瀏覽器開啟新分頁

在一般瀏覽器以Javascript設計開啟新視窗,
使用 window.open( url , "windown_name", "視窗狀態列設定"); 就可達成,
但在 Google Chrome 瀏覽器卻失效( Google Chrome Default 是自動阻擋新視窗)

繼續閱讀 >

一個遵循 Google Material 設計的 input 樣式套件

最近真是太不爽了，朋友一直譏笑我表單設計太醜~

阿我又不是設計，這根本是霸凌啊！！

後來我在網路上果真找到了還不錯的法寶 - inputs

官網: http://anjlab.github.io/inputs/

github: https://github.com/anjlab/inputs

使用方式很簡單，下載後把 css 跟 js 引入就好，重點其實是他不依賴其他的 css 框架

所以你要代入 bootstrap, 或是 foundation(6真的雷雷的) 都是可以的


以下是我代入以後的樣子

嗯哼～ 整個版面乾淨多了，在說醜的話你來！

來！哩來～

繼續閱讀 >

一個遵循 Google Material 設計的 input 樣式套件

最近真是太不爽了，朋友一直譏笑我表單設計太醜~

阿我又不是設計，這根本是霸凌啊！！

後來我在網路上果真找到了還不錯的法寶 - inputs

繼續閱讀 >

整理各家知名品牌 icon「顏色」色碼 - BrandColors 網站

現在要參考色碼，直接打開網站搜尋就可以知道這些 icon 的色碼摟！！

網站名稱：BrandColors
網站鏈結：http://brandcolors.net/

繼續閱讀 >

整理各家知名品牌 icon「顏色」色碼 - BrandColors 網站

現在要參考色碼，直接打開網站搜尋就可以知道這些 icon 的色碼摟！！

繼續閱讀 >

好用的 [ 圖片輪播 ] 套件

今天要推薦的套件是 slick( http://kenwheeler.github.io/slick/ )

一個非常好用的圖片輪播套件

使用方式非常簡單

在 head 的部分加入 CSS

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.css"/>


<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick-theme.css"/>

然後在 body 最下面加上 JS

<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js"></script>

程式碼的部分

html

<div class="slider">
  <div><h3>1</h3></div>
  <div><h3>2</h3></div>
  <div><h3>3</h3></div>
  <div><h3>4</h3></div>
  <div><h3>5</h3></div>
  <div><h3>6</h3></div>
</div>

js

# main.js
$('.slider').slick();

搞定！

幾個好用的參數

adaptiveHeight: true 自動幫你計算高度

prevArrow: '前一頁' 可以直接下 html 換掉前一頁的箭頭

nextArrow: '下一頁' 可以直接下 html 換掉下一頁的箭頭

dots: true 讓底下的點出現

jquery 版: http://kenwheeler.github.io/slick/

react 版: http://webrafter.com/opensource/react-slick

angular 版: http://vasyabigi.github.io/angular-slick/, http://devmark.github.io/angular-slick-carousel/

繼續閱讀 >

好用的 [ 圖片輪播 ] 套件

今天要推薦的套件是 slick( http://kenwheeler.github.io/slick/ )

一個非常好用的圖片輪播套件

繼續閱讀 >