javascriptとCSSに関するDocSeriのブックマーク (11)

  • NHK 2009都議選 開票速報ページがHTML的にも見た目的にもかなりキレイな件 | aquapple

    NHK 2009都議選のサイトが見た目が美しく、操作性も良いのに、Flashを一切使わずJavaScriptで制御されていることがTwitterで話題になっていました。 速報時は自動更新で獲得議席数がリアルタイムに反映されていましたが、現在は速報も終わり開票結果になっています。 動作確認も主要なモダンブラウザ[1]で動作確認が行われています。 ソースは8つのJavaScriptとdivタグに直接スタイルシートが書き込まれているだけで非常にシンプル。75行のHTMLソースの中にFlash要素はゼロとなっています。 各ブロックをクリックすると、フローティングウィンドウが出てきます。これはドラッグしたり、サイト下部に固定表示しておくことが可能となっているほか、ウィンドウの並び替えもタイトルバーをドラッグするだけで行えます。 このページの公開は15日の午後6時までとなっています。無駄に凝っているだ

    DocSeri
    DocSeri 2009/07/13
    うむ、ソースは保存しておこう。
  • クリック後の説明文を凄くオシャレに表示できる「mooSlide」:phpspot開発日誌

    mooSlide - ajax based slider - lightbox replacement The mooSlideBox v3 is a small and slim ajax based extension or replacement of the common "lightbox" that can be found on nearly every page. This lightbox clone works in IE 6/7, Opera and Firefox. クリック後の説明文を凄くオシャレに表示できる「mooSlide」。 LightBoxの一種になると思うのですが、表示の仕方がかなりオシャレなmooSlide。 クリックしたところ、ページ下部からブロックがアニメーションして説明が表示されます。 仕組みはLightBoxでも、みせ方次第でこれだけ印象って変

    DocSeri
    DocSeri 2008/02/21
    なんかFirefoxでは思いっきり崩れてますが。
  • CSSの擬似クラス:IE6/IE7でも使う方法あります - builder by ZDNet Japan

    年間5,000件の問い合わせに対応 疑問を解消したいユーザーも答える情シスも みんな幸せになるヘルプデスクの最適解 大事なのは”仕事の段取り” 幅広い業務を任されているからこそできる ひとり情シス流の業務改善術 Kubernetes活用の最適解とは? 今、注目のコンテナを活用した柔軟なIT基盤 運用、管理の課題を解決しメリットを最大化 ハイブリッドクラウド時代の救世主 企業ITを素早く進化させるためのAVS サービス開始から1年で大幅に機能がアップ 電話営業・インサイドセールの革新 AIによる自動文字起こし・会話分析が 音声コミュニケーションの可能性を拓く 新OSのWin11はどう進化したか ビジネス上の役割、開発の要因と Win11が目指した5つのポイントを紹介 データ活用は次のステージへ トラディショナルからモダンへ進化するBI 未来への挑戦の成功はデータとともにある AWSとAzur

    DocSeri
    DocSeri 2008/02/06
    「IE6/IE7でも使う」というより「JavaScriptで擬似的に表現する」
  • プログラム可能なCSS、Dynamic CSS (CSS.js)登場 | ネット | マイコミジャーナル

    Marat A Denenberg氏は11月29日(米国時間)、Dynamic CSS (CSS.js)の最新版であるDynamic CSS 1.0を公開した。Dynamic CSSJavaScriptで開発されたプログラム可能なCSSユーティリティ。mootools 1.2を使って開発されたユーティリティで、実行するにはElementとClassを含めたmootools 1.2が必要。JavaScript中にプログラマブルなCSSを表記できるというものだ。長さなどのサイズ指定に固定値ではなく計算値や変数、関数を使った計算式を記述できる。 Webブラウザ互換性確保やWebブラウザに特化したプロパティの指定などをおこなう場合、PHPやServletなどのサーバサイド技術を使って対象のWebブラウザに適したCSSファイルを生成するといった処理をすることが多い。Dynamic CSSはその処理

  • CSS レイアウト切り替えスイッチ | WWW WATCH

    Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレ... Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレイアウトの 3種類がよく使われますが、どのレイアウトが一番文章が読みやすかったり、利便性が高いのかって考えたときに、当然好みは人それぞれ。 じゃあ、その人の好みで、3つのレイアウトを切り替えられるようにしたらいいじゃんということで、そんな CSS 切り替えスイッチを作ってみました。 サンプルはこちらで確認できます 全ファイルのダウンロードはこちら (zip ファイル / 10KB) デフォルトでは横幅固定のレイアウトになっています。スイッチを押すたびにレイアウトが選択

    CSS レイアウト切り替えスイッチ | WWW WATCH
  • http://youmos.com/news/xray

  • CSS&JavaScriptカレンダーライブラリ集:phpspot開発日誌

    DHTML Site - 10 Free CSS and Javascript Calendars Calendars may be used on webpages for various reasons, such as allowing users to easily pick a date in a form, or just to provide monthly information. CSSJavaScriptカレンダーライブラリ集。 いろんなCSSJavaScriptで実装されたサンプルライブラリが紹介されています。 Monket Calendar Quick Calendar Using AJAX and PHP Integrating Google Calendar into your Site JS Calendar The DHTML / JavaScript

  • Flashなしでもここまで作れる!:ITpro

    Webプログラミングは,プロはもちろんアマチュアのプログラマの間でも,もはや欠かせない開発ジャンルの一つです。しかし,書籍や雑誌の解説記事のほとんどが,データベースがどうとか,サーバーサイドがどうとか,どうしてもディープな方向に進んでしまう傾向にあります。もちろん,それはそれで大切なことなんですが,いったい何割の人が,その技術を“自分の”ホームページに使っているでしょう。 最近話題の「リッチ・コンテンツ」にしても同様です。例えばFlash。たしかにActionScriptというスクリプト言語を使えば,動く,鳴る,つながると,いいこと尽くめです。でも,いかんせん「Macromedia Flash MX 2004を買ってきてね」とあっては,皆がみな使えるわけではありません。 Part1でも解説があったようにblog(ブログ)の認知度が上がり,利用率も増えて,プロバイダからの提供体制も整ってきて

    Flashなしでもここまで作れる!:ITpro
    DocSeri
    DocSeri 2006/10/18
    いや逆でしょ。この内容でFlash使う必然性がないというだけのことでは。
  • Dreamweaverの代わりになるフリーソフト「Aptana」 - GIGAZINE

    JavaScriptの開発環境、要するにJavaScript用IDEという位置づけなのですが、HTMLCSSの構造をアウトラインで示してくれたり、文法の間違いを指摘してくれたり、やっていることはほとんどDreamweaverの持っている機能と同じです。 特に面白いのはJavaScriptCSSなどがInternetExplorerとFirefoxに対応しているかどうかが一発で分かる点。JavaScriptのエラーについても細かい部分まで指摘してくれます。つまり、実行しなくてもエラーがドコにあるのか分かる「静的解析」が可能というわけ。 WindowsMacintosh、Linux版があり、Eclipseプラグインとして動作するバージョンもあります。 スクリーンショットや実際に動かして機能を解説しているムービー、ダウンロードは以下から。 Aptana: The Web IDE http:

    Dreamweaverの代わりになるフリーソフト「Aptana」 - GIGAZINE
  • 戻るボタンの実装方法について

    ■ 戻るボタンの実装方法について はてな が グリーン電力化とか良くわからない事を始めた ので、試しにTシャツの注文ボタンを押したのですが、この時フォーム内の「戻る」ボタンについて気が付いた事があったので、その事について。 フォームには一つ前の画面に戻るための「戻る」ボタンと、次の画面へ進むための「次へ」とか「送信」とかいうボタンが置いてある事が多いと思うのですけど、デザイン上とか何とかとにかく、「戻る」が左にあって「次へ」が右にある場合って HTML の記述ってどうすれば良いか悩みませんか? 「次へ」は当然 submit ボタンなんですけど、「戻る」も submit ボタンにしてしまうと、入力フィールド上でエンターキーを押した場合に「戻る」ボタンを押した事になってしまう。*1なんとなく「エンター=進む」みたいな印象があるので、エンターキーで戻ってしまうってのはどうしても変だと感じるので嫌

    DocSeri
    DocSeri 2006/06/19
    「進む」を先に記述しておいてCSSで順序入れ替えればEnterで進むようにできると思う。
  • Bridge Word

    This shop will be powered by Are you the store owner? Log in here

    DocSeri
    DocSeri 2005/09/09
    特にJavaScriptがレンダリングしたHTMLソースを読める機能拡張は必須。
  • 1