タグ

ブックマーク / www.webopixel.net (5)

  • [DEMO]スクロールするとページトップへ戻るボタンがアニメーションで表示 | webOpixel

    こんにちは これはスクロールするとページトップへ戻るボタンがアニメーションで表示されるサンプルです。 jQueryを使用しています。 CSS3は装飾しているだけなので動作には関係ないです。 このサンプルの記事はこちら

    sima-box
    sima-box 2014/07/11
    スクロールでトップへ戻る アニメーション
  • jQueryでスクロールすると表示する系いろいろ

    Posted: 2012.03.08 / Category: javascript / Tag: jQuery, アニメーション 最近はスクロールするときにいろいろ仕掛けをするのが流行なようです。 ここではシンプルにある要素の位置とか最下部までスクロールしたら何か表示するということをやってみます。 ちょっとスクロールするとフェードして「トップへ戻るボタン」を表示を表示します。 ボタンは下の方にこんな感じで配置します。 html <p id="page-top"><a href="#wrap">PAGE TOP</a></p> fixedにすると固定配置されます。 css #page-top { position: fixed; bottom: 20px; right: 20px; font-size: 77%; } #page-top a { background: #666; text-

    jQueryでスクロールすると表示する系いろいろ
    sima-box
    sima-box 2014/06/27
    メニュースクロールしても出ている ページトップへ固定
  • PhotoshopってFireworksと違ってここがダメだよねって思ってたけど使い方知らないだけだった件

    Posted: 2013.04.23 / Category: WebDesign WebデザインツールとしてFireworksとPhotoshopがよく挙げられますが、私はFireworksをメインに使用しています。理由はFireworksと比べるいろいろと不便な点があったからなのですが、ちょっと調べたらいろいろと知らないだけだったのでメモしておきたいと思います。 Photoshopってキャンバスで直接選択できなくね? Fireworksは選択ツールでキャンバスでオブジェクトを直接選択できるのに、Photoshopはレイヤーから選択しないといけないから直感的じゃないですよね。いえいえ直接選択もできますよ。 左パレットから「移動ツール」を選択ます。そのままだと選択されているレイヤーを移動させるだけのツールですが、「cmd + 左クリック」することで選択することができます。 ドラッグすれば範囲

    PhotoshopってFireworksと違ってここがダメだよねって思ってたけど使い方知らないだけだった件
    sima-box
    sima-box 2013/04/24
  • jQueryで長いページの区切り(セクション)ごとに背景を変化させる

    Posted: 2011.11.07 / Category: javascript / Tag: jQuery, アニメーション 最近は一ページに内容を詰め込んだ縦長のページが増えてきましたね。 そこでスクロールすると区切り(セクション)ごとに背景が変化したら、面白いのではないのかと思いましたのでやってみました。 html sectionはhtml5ではなくdivにclassでマークアップした昔ながらの形式にしました。 html <div class="section"> <h2>Section0</h2> <p> ここは0番目のコンテンツです。 </p> </div> <div class="section"> <h2>Section1</h2> <p> ここは1番目のコンテンツです。 </p> </div> <div class="section"> <h2>Section2</h2>

    jQueryで長いページの区切り(セクション)ごとに背景を変化させる
    sima-box
    sima-box 2012/03/21
    ページスクロールで背景変える 縦長サイト
  • WordPressのsingleテンプレートをカテゴリ別に切り替える

    Posted: 2010.07.09 / Category: WordPress / Tag: テンプレートカスタマイズ 通常のブログではなかなかやらないかもしれませんが、コーポレートサイトをWordpressで運用する場合、お知らせページや制作実績などページ別にデザインを変えたい場合があったりします。 そこで、カテゴリーごとに割り振られたIDを取得し、条件分岐でテンプレートを切り替えてみます。 カテゴリーIDを調べる まずは分岐させたいカテゴリーのIDを調べておく必要があります。 このカテゴリーIDですが通常ブログを運営するうえであまり必要ないせいか、少しわかりづらかったりします。 管理画面で「投稿」→「カテゴリー」でカテゴリー編集画面を表示します。 取得するカテゴリー名をクリックまたは、マウスオーバーしてリンク先のアドレスの末尾を確認してください。 /wp-admin/categori

    WordPressのsingleテンプレートをカテゴリ別に切り替える
    sima-box
    sima-box 2011/05/31
    Wordpressのテンプレートをカテゴリ別に表示 ワードプレス
  • 1