Movatterモバイル変換


[0]ホーム

URL:


はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数!

アプリで開く

はてなブックマーク

タグ

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

タグの絞り込みを解除

webデザインに関するIGA-OSのブックマーク (10)

  • 現在の実装でよく使用されるCSSの機能、これから登場するCSSの新機能のまとめ

    現在の実装でよく使用されるCSSの機能をはじめ、まもなく使用できるようになる新機能まで、現在とこれからのCSSを紹介します。CSS3が登場した2015年以降の新機能、2022年これから登場するCSSの新機能、最近のCSSについてWeb制作に携わる人は要チェックです。 What's New SinceCSS3 by Chris Coyier 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめにCSS3以降の新機能CSSワーキンググループ これから登場する新機能 はじめに 「CSS3」はCSSにとって大成功でした。たくさんの新機能がリリースされ、素晴らしいものばかりでした。CSSグラデーション、CSSアニメーション、border-radius、box-shadow、transform、などたくさんあります。さらに、CSS

    現在の実装でよく使用されるCSSの機能、これから登場するCSSの新機能のまとめ
    • パララックスサイトの作り方の初歩

      最近パララックス(視差効果)を取り入れたサイトが増えてきました。 仕組みや簡単なものを作れるようにしておきたかったのでいろいろ試してみました。 ちなみにもっと効率良く作れる方法とかもあるかもしれませんので、一例ということで御覧ください。プラグインはまだ試したことがないので そちらを使ったほうが楽かもしれません。 パララックス効果のjQueryプラグインまとめ あと動作はこの記事時点でのFirefoxの最新版でしか確認はしていません。 スクロール量を取得する まずはスクロールすると動くので、スクロール量を取得します。ちなみにjQueryを使ってます。 $(function(){ $(window).scroll(function(){ var y = $(this).scrollTop(); $("#num").text("スクロール量:" + y);//表示用 }); }); サンプルペー

      パララックスサイトの作り方の初歩
      IGA-OS
      IGA-OS2012/07/03非公開
      流行りもの
      • HTML5マークアップの心得と作法

        HTML5のマークアップの特徴を一言で表すとすれば「セマンティクス」。それ故に、HTML5では文脈に合わせてマークアップしなければいけません。もはや、マークアップは単純作業ではなくクリエイティブなものになっているのです。マークアップにも心得と作法がよりいっそう重要になってきています。セッションでは、HTML5仕様ではマークアップに何を求めているのか(心得)、そして、我々はどのようにマークアップをすべきか(作法)、について具体的に解説します。

        HTML5マークアップの心得と作法
        IGA-OS
        IGA-OS2011/08/30非公開
        分かりやすいチュートリアル!
        • カッコよく動くポップアップでより分かりやすくメッセージを表示出来る「JQUERY BUBBLE POPUP」:phpspot開発日誌

          カッコよく動くポップアップでより分かりやすくメッセージを表示出来る「JQUERY BUBBLE POPUP」 2010年11月29日- JQUERY BUBBLE POPUP v.2.3.1 - display animated and shadowed "bubble" popups with fewlines of code in jQuery カッコよく動くポップアップでより分かりやすくメッセージを表示出来る「JQUERY BUBBLE POPUP」 カーソルを合わせた際に、単にポップアップするのではなく、ポップアップ自体がフェードインアニメーションしながら動きをもって表示されることでより、利用者の注意をひくことができそうです。 見た目も影付きでカッコいいのが特徴です。 デザインは選べます。 何かにカーソルを合わせた時だけじゃなくて最初から特定のエレメント上に表示しておくこともでき

          IGA-OS
          IGA-OS2010/11/29非公開
          使ってみようかな。
          • 今日からCSS3アニメーションを使えるようになるチュートリアル

            CSS3のアニメーションってスゴい! 先日のぽんたくんの記事でも紹介されたように、CSS3ではアニメーションも制御できるようになりました。 ということで、ぼくもCSS3のアニメーションを使ってdemoをいくつか作ってみました。 SafariやChromeなどwebkitブラウザで表示してみてください。 コピペで使えるCSS3アニメーション - jsdo.it ※PLAYボタンをクリックすると表示されますよ 見れない人のために動画も撮ってみました。 どうですか?CSSだけで、まるでFlashを使ってるような表現ができちゃうんです。 今回はこのCSSのアニメーションのチュートリアルをご紹介します。 「NEW!」というアイコンが、1文字ごとにぴょこんぴょこん跳ねるアニメーションを作ってみましょう。 上記のdemoでいうと二つ目の動きです。HTML <p class="animetionNew 

            IGA-OS
            IGA-OS2010/09/27非公開
            そろそろCSS3も勉強しようか・・・。
            • おそろしく高機能でフリーなFlashフォトギャラリーの決定版「dfGallery 2.0」 - GIGAZINE

              AJAXによって複数の好きな画像を一気にアップロードし、それをフォトギャラリーとしてページに埋め込んで表示できるのがこの「dfGallery 2.0」。フルスクリーンモードにすることもでき、FlickrやPicasaのアルバムと連携可能で、カスタムテーマとマルチスキンによって見かけやレイアウトを大幅かつ自由に変更可能で、さらに管理用のコンソール画面、複数のギャラリーセットとアルバムのサポート、BGMの再生なども可能です。これだけ高機能であるにもかかわらずフリーでの利用(Apache License 2.0)が可能となっており、あらゆる局面で利用可能となっています。 実際の動作デモやインストールとカスタム方法を解説したムービーの再生などは以下から。 dfGallery 2.0 - Free Flash Gallery | Dezinerfolio 上記ページからこの「dfGallery 2.

              おそろしく高機能でフリーなFlashフォトギャラリーの決定版「dfGallery 2.0」 - GIGAZINE
              • duree dpe

                Par la rédaction Rédigé le 2021-05-25 Les diagnostics de performance énergétique dpe doit être affiché pendant toute sa durée de validité de 10 ans l'affichage doit être visible par le locataire. Dans le diagnostic je pense que tout est résumé une super équipe sur laquelle nous pouvons compter à tout moment de surcroit très sympathique. De la performance énergétique dpelogement tous les cas à par

                • iPhone向けサイトのユーザビリティ最適化でチェックしておきたい項目まとめ

                  iPhoneを始めとするタッチパネル&フルブラウザ搭載のスマートフォンの普及が進んでいる。iPhoneの出荷台数は世界で3000万台、日国内に関して公式な発表はないが200万台を超えていると推測されている。今後はWindows Mobile端末の進化やAndroid携帯電話により、このスタイルの携帯端末の利用者がさらに拡大していくことが予想される。 今回は、こういったタッチパネル&フルブラウザ搭載のスマートフォンからのウェブサイト/サービスのユーザビリティについて、主にiPhoneを題材に考えてみよう。iPhone対応は形式にとらわれず「ユーザー中心」視点でiPhoneからのウェブ利用には、従来の携帯電話と同様の「携帯性の高さ」「位置情報との連動」などに加え、 従来の携帯電話と比べて画面サイズが広い 端末の処理能力が高く、アプリでのサービス提供の自由度が高い 独自の操作(画面をつまむ

                  iPhone向けサイトのユーザビリティ最適化でチェックしておきたい項目まとめ
                  • iGoogleのようにコンテンツをドラッグ&ドロップできるスクリプト(2009/7)

                    boxの中身にrssフィードを読み込ますことができます。ボックスを動かすのはJavaScriptですがフィードを読み込むためにMagpieRSSを使っているのでphpが使えるサーバーでないと作動しません。ちなみに私はこれを使ってiチャート広場っていうページを作りました。

                    iGoogleのようにコンテンツをドラッグ&ドロップできるスクリプト(2009/7)
                    IGA-OS
                    IGA-OS2009/07/21非公開
                    自分のWebサイトで使ってみたいな。
                    • 今時のWebサイトを構築するのに便利そうなCSSフレームワーク·Malo MOONGIFT

                      海外に見る最近のWebサイト(特にトップページ)のデザインは、縦に何段かに分かれたデザインが多い。一番上は大きな画像とともに二段構成、その下が2×2のテーブル組みなどでサービスの特徴を書き、次に横並びの3段で利用者の声といった具合だ。 今時のWebサイトっぽいデザインが簡単に まぁテーブルで組めばできないことはない。だがそれはださい、ださすぎる。CSSだけでどうにかしたい所だが、ブラウザの互換性も含めて考えるとプログラマにはとても無理だ。Firefoxで見られるように何とか組んで、IEで見たら吹き飛んでいた…なんてなったらもうやる気がなくなる。そんなことになる前に使いたいのがMaloだ。 MaloはGoogle Code上で公開されているCSSフレームワークで、GPLの下に公開されている。 Maloが実現するのは複雑な、それでいて簡単に設定できるCSSデザインだ。ヘッダとフッターを設けた上

                      今時のWebサイトを構築するのに便利そうなCSSフレームワーク·Malo MOONGIFT
                      IGA-OS
                      IGA-OS2008/12/08非公開
                      これは興味深い。導入を検討する。
                      • 残りのブックマークを読み込んでいます1

                      お知らせ

                      公式Twitter

                      • @HatenaBookmark

                        リリース、障害情報などのサービスのお知らせ

                      • @hatebu

                        最新の人気エントリーの配信

                      処理を実行中です

                      キーボードショートカット一覧

                      j次のブックマーク

                      k前のブックマーク

                      lあとで読む

                      eコメント一覧を開く

                      oページを開く

                      はてなブックマーク

                      公式Twitter

                      はてなのサービス

                      • App Storeからダウンロード
                      • Google Playで手に入れよう
                      Copyright © 2005-2025Hatena. All Rights Reserved.
                      設定を変更しましたx

                      [8]ページ先頭

                      ©2009-2025 Movatter.jp