タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

JSに関するatsushi1972のブックマーク (3)

  • [JS]レスポンシブにしっかり対応!高さの異なるパネルを揃えたり、成り行きにするスクリプト -EqualHeight.js

    divなどで配置したパネル内の要素の量が異なっていても、全てのパネルの高さを揃えるjQueryのプラグインを紹介します。 高さを揃える系としては後発のスクリプトですが、レスポンシブにしっかり対応しているのがポイントです。 一列のパネルはもちろん、段組でもOK、省スペースのスマフォ用に成り行きもコントロールできます。

    atsushi1972
    atsushi1972 2014/01/06
    レスポンシブにしっかり対応!高さの異なるパネルを揃えたり、成り行きにするスクリプト -EqualHeight.js divなどで配置したパネル内の要素の量が異なっていても、全てのパネルの高さを揃えるjQueryのプラグインを紹介します
  • 数行加えるだけでパララックススクロールを実装できるチュートリアル | コリス

    実装は簡単です。 既存のページにもこれなら簡単に組み込めると思います。 HTML パララックススクロール用の背景を配置するために先頭に空のdiv要素を加え、あとのコンテンツは普通に実装します。 <div class="background"></div> <div class="wrapper"> <h1 class="pageTitle">見出しLv1</h1> <h2 class="pageSubTitle">見出しLv2</h2> <p>パラグラフ</p> <p>パラグラフ</p> <p>パラグラフ</p> </div> <div class="slogan"> <h2 class="sloganTitle"> Parallax scrolling </h2> </div> <div class="wrapper"> <h1 class="pageTitle">見出しLv1</h1>

    atsushi1972
    atsushi1972 2013/08/02
    既存のページに数行加えるだけでパララックススクロールを実装できるチュートリアル デモはスクロールすると、コンテンツと背景画像がいい感じのタイミングでずれてスクロールします。 [] via Pocket August 02, 2013 at 09:07AM
  • レスポンシブ対応サイトを作成する超軽量のスクリプト -skel.js | コリス

    スタンドアローンで動作する19KBの超軽量スクリプト。 さまざまなレイアウトに対応できるグリッド。 表示サイズごとのブレイクポイントの設定も簡単。 resetやbox-modelなどの有用なCSSのショートカットを用意。 プラグイン機能も備えているので、拡張にも対応。 skel.jsのデモ デモはシンプルな構成のページが表示が用意されています。 まずはデスクトップサイズとして、幅1200pxで表示してみます。 デモページ:幅480pxで表示 skel.jsの使い方 jQueryや他のスタイルシートなどを用意せずに、すぐに利用できます。 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <script src="skel.js"></script> jQueryもスタイルシートも他のファイルは必要ありません。 Step 2: スクリプトのセットアップ スクリプトのセ

    atsushi1972
    atsushi1972 2013/05/24
    jQueryも外部CSSも不要!レスポンシブ対応サイトを作成する超軽量のスクリプト -skel.js デスクトップ・タブレット・スマフォ向けのレスポンシブ対応サイトを作成する超軽量(19KB)のスタンドアローンのスクリプトを紹介し
  • 1