Sunday, September 1, 2013

そのた (フロントエンド)

ユーザーのアクセス環境を取得
http://www.myu-zin.com/webridge/archives/1038.html
cssではうまくできなかったから、phpでやたた
phpはフロントエンドもできるけどサーバー系だし、どうやって記事を分類したら良いのかを迷うw

JSでウィンドーサイズの変更を取得するプラグイン
http://d.hatena.ne.jp/cyokodog/20101101/exresize01

コピーしましたってやつを実装
http://tech.genestream.co.jp/2013/09/11/clipbord_copy_of_web_application/
このブログを書いていた人の勤務先がつい最近知り合った人のインターン先だったw

一行で左右に文字をおきたいとき。
http://the-zombis.sakura.ne.jp/wp/?p=1564

firstクラスとsecondクラスを同じ行に入れたい

// html
こちらがfirstです
こちらがsecondです
// css .first { float: left; } .second { text-align: right; }

これでいける

文字を省略して...と表示させたいとき
http://ameblo.jp/linking/entry-10268808742.html
// html
これはとても長い文章です。それはとてもとても長いです。まるで、象の鼻みたい。もしくはキリンくらい。。。ちょっと言い過ぎたかも。。。
// css .third { width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; }

phpでもやる方法があったんだけど、また次使うときに調べる

CSSで図形を作る
http://css-tricks.com/examples/ShapesOfCSS/

要素に影をつける
http://www.paulund.co.uk/creating-different-css3-box-shadows-effects
アイコン系のCSSリンク
CSS3 Image Styles

beforeとafterの説明。超絶わかりやすい
http://www.hongkiat.com/blog/pseudo-element-before-after/

JSで要素を追加。ついでにクラスも二つくらいつけちゃうし、style属性も決めちゃう
いつもはjQueryでやってるんだけど、事情でJSだけでしからやらないといけないときのために

var p = document.createElement('p');
p.innerText = 'Hello, This is SAMPLE SENTENCE';
          
// クラスを追加
p.classList.add('red');
p.classList.add('sample');

// sytle属性を追加
p.style.color = 'red';
p.style.fontSize = 35;

document.getElementById('sample').appendChild(p);

テキストの色を背景色で変えるプラグイン
http://www.kennethcachia.com/background-check/index.html

要素を反転させるjQueryプラグイン
http://lab.smashup.it/flip/
絶対役に立つ

No comments:

Post a Comment