記得把Any XHR勾掉
Category: Uncategorized
【防止frame嵌套】
if (top.location != self.location) {
top.location = self.location;
}
var str = document.URL;
str = str.toLowerCase();
js如何判斷是否在iframe中及防止網頁被別站用 iframe嵌套
【設定網頁為no-cache】
response.setHeader(“pragma”, “no-cache”);
response.setHeader(“cache-control”, “no-cache”);
response.setDateHeader(“expires”, 0);
網頁前端各種小筆記
這個是outline…
button:focus{
outline: none;
}
jQuery 網頁捲動動畫
$(window).scroll(function() {
$(“.slideanim”).each(function() {
var pos = $(this).offset().top;
//傳回此物件距離最上面的長度
var winTop = $(window).scrollTop();
// 偵測window的捲動值
if (pos < winTop + 600) {
//假設原距離top有1000,捲軸滑到距離它600px時就會滑出來
$(this).addClass(“paraslide”);
}
});
});
.slideanim { visibility: hidden; }
.paraslide { /* The name of the animation */ animation-name: slide; -webkit-animation-name: slide; /* The duration of the animation */ animation-duration: 1s; -webkit-animation-duration: 1s; /* Make the element visible */ visibility: visible; }
/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */ @keyframes slide { 0% { opacity: 0; -webkit-transform: translateY(70%); } 100% { opacity: 1; -webkit-transform: translateY(0%); } } @-webkit-keyframes slide { 0% { opacity: 0; -webkit-transform: translateY(70%); } 100% { opacity: 1; -webkit-transform: translateY(0%); } }
gulp安裝使用教學
網路上雖然已經有很多教學了,但是自己實作再記一次筆記,看自己的筆記比較好懂,就來寫一下囉。
※RUBY記得要是最新的版本
若gulp無效顯示:
‘gulp’ is not recognized as an internal or external command,
operable program or batch file.
,試試:npm install -g gulp-cli
※記得compass、compass create 要先裝好再執行gulp的watch
Gulp doesn’t work
https://stackoverflow.com/questions/26827560/gulp-doesnt-work
↑安裝有問題參考這篇
步驟
- npm install –save del
- npm install gulp
- gem install compass
- compass create
- npm init
- npm install gulp-compass –save-dev
- npm install –save-dev gulp-util
- npm install –save-dev gulp-watch
- 編輯config.rb檔案路徑(檔案最前面記得加Encoding.default_external = ‘utf-8’)才能打中文的註解
- 建立gulefile.js於想要的目錄
首先輸入指令安裝gulp
然後安裝compass
npm init
呵呵 安裝gulp-compass
記得在根目錄自己建一個gulpfile.js檔
然後貼上其它網站複製來的文字(欸
在cmd上打gulp … 有跑就有救了!
然後難的開始了
發現bug了 崩潰崩潰
輸入compass create 安裝一些compass要的檔案
Congratulations! Your compass project has been created.
You may now add and edit sass stylesheets in the sass subdirectory of your project.
Sass files beginning with an underscore are called partials and won’t be
compiled to CSS, but they can be imported into other sass stylesheets.
You can configure your project by editing the config.rb configuration file.
You must compile your sass stylesheets into CSS when they change.
This can be done in one of the following ways:
1. To compile on demand:
compass compile [path/to/project]
2. To monitor your project for changes and automatically recompile:
compass watch [path/to/project]
More Resources:
* Website: http://compass-style.org/
* Sass: http://sass-lang.com
* Community: http://groups.google.com/group/compass-users/
To import your new stylesheets add the following lines of HTML (or equivalent) to your webpage:
<head>
<link href=”/stylesheets/screen.css” media=”screen, projection” rel=”stylesheet” type=”text/css” />
<link href=”/stylesheets/print.css” media=”print” rel=”stylesheet” type=”text/css” />
<!–[if IE]>
<link href=”/stylesheets/ie.css” media=”screen, projection” rel=”stylesheet” type=”text/css” />
<![endif]–>
</head>
再改一下資料夾的路徑
跳出好多訊息啊…然後我再打gulp試試
後來就開始watch了?
按Ctrl + C 跳出提示要不要停止的訊息。
結果都可以用了,爽爽der,高潮惹
靠妖啦,結果發現我的watch在存檔之後根本沒動靜
回頭來改了一下我的gulpfile.js
參考這一篇寫出來的
結果萬歲終於可以用了
QQ我真的被它搞死了幹
sublime必裝套件
pretty JSON
HTML CSS JS Prettify
2015-2017網頁語言
2015年
【瀏覽器方面】
- Microsoft Edge於1月發佈
- Google Chrome 56阻擋FLASH
【設計方面】
- 網頁越來越長,以滑動取代點擊
為的是讓手機使用者省下點擊網頁的時間
別再讓網友迷失在點擊中,2015 年十大網頁設計趨勢PART1
【HTML】
2014年底HTML5成为推荐标准,2016年公布HTML5.1。
- HTML 5.0推薦標準上式上路(2014上的)
- 2016年年九月發佈
Spongecell Launches HTML5 Format For Personalized Video
Azure launches HTML5 version of IPTV system
With VR in your browser, see the world like a Grizzly
試著google:
vr html5
HTML5新聞
Netflix
從近期的科技來聯想:物聯網、VR、
WordPress學習筆記
Feb. 11 .2017
發現我的圖片上傳都會預設選擇中等大小或是小型大小,我想要full的,看了這篇教學,成功讓它上傳之後都會先幫我選好full size了。
How to Change the Default Attachment Display Settings in WordPress without a Plugin
漫遊網站心得
在這裡發現他們的英文字體用”Open Sans”這個字型,還真是好看啊,以後可以來用。
庭喵的老公大全
這些都是庭喵的老公。
part 1.
我老公
Love drops 路西法
我老公 Part.2 – Updated Jan 23.2017
ホブルデイ
寧次
神宮寺蓮
巴衛
葉山
葉王
葛力姆喬
奈落
我老公 Part.3 – Updated Feb 10 2017
時計屋
艾斯
光明騎士一代男主角
泰明
約書亞
闇帝
伊格爾
洛基
我老公 Part.4 – Updated Mar 8 2017
樞
虎王
Howl
Saber
一方通行
愛德格
靜蘭
Wataru
我老公 Part.5 – Updated Apr 16 2017
風間千景
宗次郎
傑尼西斯
Archer
緋村劍心
雪代緣
古泉一樹
スノウ
我老公 Part.6 – Updated May 29 2017
織田信長
咢
里維
不破尚
狂
游佐
星宿
阿葛