タグ

2014年5月27日のブックマーク (7件)

  • jQueryで1ページごとにスクロールして画面遷移させるUIを実装する方法|BLACKFLAG

    以前、iPhone5sのプロダクトページがリリースした頃に『簡単にパララックス実装可能な軽量スクリプト「skrollr」&コンテンツごとにページスクロールするjQueryプラグイン「fullPage.js」「One Page Scroll」』と題して1ページをフルスクリーン表示にして、画面全体をスクロールさせることで、1ページ分(1コンテンツ分)を画面遷移させるUIを実装できるjQueryプラグインを紹介しましたが、自分なりにもっと使いやすい形で実現できないかやってみた実験をご紹介してみます。 【2014/08/05 追記】 各ブロック内での横スライド機能を追加しました。 まずは動作サンプルから。 下記のサンプル画面でマウスホイールスクロールもしくは画面右側のナビゲーションボタン等を使って画面(ページ)を切り替えてみてください。 「jQueryで1ページごとにスクロールして画面遷移させるU

    jQueryで1ページごとにスクロールして画面遷移させるUIを実装する方法|BLACKFLAG
  • YouTubeやVimeoなどの埋め込み動画をレスポンシブ対応させる方法 - NxWorld

    割と使用頻度が高いのに毎回のように「どうするんだっけ...」となってしまうので備忘録。 YouTubeやVimeoなどのような埋め込み動画をレスポンシブ対応させる方法で、特に面倒な記述も必要なく実装できます。 実装にはHTMLCSSを下記のように記述し、HTMLは動画を表示させるiframeをdiv要素で囲み、CSSはdivとiframeそれぞれにスタイルを指定します。 <!-- YouTube --> <div class="video"> <iframe src="//www.youtube.com/embed/{動画コード・パラメータ指定部分}" frameborder="0" allowfullscreen></iframe> </div> <!-- Vimeo --> <div class="video"> <iframe src="//player.vimeo.com/vid

    YouTubeやVimeoなどの埋め込み動画をレスポンシブ対応させる方法 - NxWorld
  • Font Awesome で Qiitaロゴっぽいアイコンを表現 - Qiita

    Font Awesomeを利用すると、WEBサイトでアイコンっぽいフォントを使うことができ、非デザイナだと割と重宝します。 いま登録されているアイコンの種類 ⇒ http://fortawesome.github.io/Font-Awesome/icons/ 一番かんたんに利用を始める方法は、次のようにCDNから読み込めばいいです。 <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

    Font Awesome で Qiitaロゴっぽいアイコンを表現 - Qiita
  • Free Seamless Vector Background Collection (Illustrator EPS) – Speckyboy

    Today, we’re excited to offer a free vector seamless background pack designed by Vectorious. These backgrounds can be used in any aspect of design, from web backgrounds to apparel and flyer designs. The pack includes six vector background Illustrator EPS source files that can be easily customized with any color. Additionally, there are six colored previews and six black and white previews to help

    Free Seamless Vector Background Collection (Illustrator EPS) – Speckyboy
    ku_marin
    ku_marin 2014/05/27
    クレジット不要。ダマスク柄とかのシームレスなテクスチャ
  • kado the 108Z | PRINTERS'FLOWERS

    アドビイラストレーターにてアウトライン化した著作権フリーの角の装飾活字を108の系統で10種類ずつ1080個をご用意しました。過去の文献からピックアップした108種類の装飾をサンプリングし手描きで書き下ろし、アドビイラストレーターや、現在の印刷に適したデータとして作成したものを、より深く広く使っていただく為にパレットとしての能力を高め、1080個もの装飾をサンプリングと手描きで仕上げました。 組み見は、こちらをチェック→ https://www.facebook.com/media/set/?set=a.494680127259654.1073741825.148278955233108&type=3 ご購入はこちらからご利用いただけます→ BOOTHhttps://fengfeeldesign.booth.pm そのほかのラインナップも是非チェックお待ちしております kado the

    kado the 108Z | PRINTERS'FLOWERS
    ku_marin
    ku_marin 2014/05/27
    角の装飾素材。著作権フリーみたい
  • git-svnでSourceTreeを使う! - Qiita

    git-svn環境でいろいろやる時に、黒い画面使うよりもデザイナさんにとってはGUIで書かれたアプリを使う方が気軽に使えるんじゃないかとおもって、少しだけ探したのですが、qiitaで見つけた記事がいい感じだと思ったので実際に試してみました。 それで、よく使う作業は具体的にどう操作すればよいか調べてみました。 こちらのqiitaの記事を参考にさせて頂きました。 http://qiita.com/items/263577c8cc4e1c65b19b 1.インストール こちらから。 http://www.sourcetreeapp.com/ 2.ターミナルでgit svn cloneする 3.SourceTreeで開く 「ファイル→開く」で開く 4.作業について 僕が思った3パターンを想定して書いてます。 1.masterを変更してsvnのtrunkに反映させる場合 ※個人的には、svnのtru

    git-svnでSourceTreeを使う! - Qiita
  • 【操作系が強化系の修行すんな】HUNTER×HUNTERの「念能力」から学ぶ人生戦略 - アイデアの0.5px

    出典:富樫義博『HUNTER×HUNTER』集英社 ハンターハンターが6月(来週)より連載再会となるそうですね。 http://huntersokuho.doorblog.jp/archives/38602498.html よい機会なので、念能力診断から学べる「人生戦略」について書きたいと思います。 『あなたは何系統か?その反対側にある系統は何か?』 出典:富樫義博『HUNTER×HUNTER』集英社 この世界で念能力は、6つの系統に分けられています。 例えば強化系と診断された人は、強化系に最も秀でているということになります。 そして、そのとなりの変化系・放出系は得意だけれど、離れている具現化系・操作系は不得意なのです。 「もしも、これから覚えようとしている能力があっても、自分のオーラの性質と合わなければ苦労することになるでしょう」と、お師匠さまは言っています。 例えば、操作系の人が、一生

    【操作系が強化系の修行すんな】HUNTER×HUNTERの「念能力」から学ぶ人生戦略 - アイデアの0.5px
    ku_marin
    ku_marin 2014/05/27
    たしかにヒソカの能力って戦闘向きじゃないなー