タグ

お知らせに関するretmoのブックマーク (2)

  • 【HTML編】ブラウザにお知らせを表示して自動的に消えるトーストを作る | ゆーそうとITブログ〜WordPress・Xserver・アイキャッチ画像作成ツール〜(旧:ゆうそうとITブログ)

    Webサイトを見ているときに右下のあたりに ポッ と四角いエリアが浮き上がってきてメッセージが表示されて、クリックしたり数秒経つと消えているようなものを時々みかけます。 この四角いエリアのことをトーストというようです。ちょっと面白そうだったので自分でこのトーストを作れるようにするにはどうすればいいのかな?と試してみました。 トーストってこんな感じのもの トーストって(自分が思うに)、よくお買い物サイトとかに行くと「あと24時間以内に注文すると20%オフ」とかいう、とても気になる情報がポッと表示されて気づいたら消えている…ようなものだと思います。 例えば こんな感じのもの、でしょうか? ちゃんとIT用語で調べると、 IT用語辞典 トースト トーストとは、主にデスクトップアプリケーションの機能で、情報通知用の小さなウィンドウをディスプレイの下方から一時的にポップアップ表示することである。 (中

    【HTML編】ブラウザにお知らせを表示して自動的に消えるトーストを作る | ゆーそうとITブログ〜WordPress・Xserver・アイキャッチ画像作成ツール〜(旧:ゆうそうとITブログ)
  • jQueryでニュースティッカーをシンプルに実装する方法|BLACKFLAG

    Webサイト上での限られたスペースにお知らせなどの 複数にわたる情報を表示させたい際に便利なニュースティッカー。 jQueryプラグインでもいろいろな形状のニュースティッカー用プラグインがありますが シンプル(ベーシック)な動きのニュースティッカーを 極力シンプルなスクリプト構成で実装することが出来ないか試してみたので紹介してみます。 ニュースティッカーの切り替え動作については ——————————————————– ・フェード切り替え ・画面下からスライドイン ・画面右からスライドイン ——————————————————– の3パターン構成にしてみます。 まずフェード切り替えパターンのサンプルから。 HTML構成は以下の様になります。 ◆HTML <div class="ticker" rel="fade"> <ul> <li><a href="#1">【News1】このテキストはNe

    jQueryでニュースティッカーをシンプルに実装する方法|BLACKFLAG
  • 1