[暴満館] JavaScriptによるCSSの操作
またFirefoxは短縮形で取得しようとすると、設定していないプロパティにデフォルト値が入った状態で返ってくるので注意する。 getStyleValue( "div.hoge", "background" ) //Mozilla : rgb(17, 34, 51) none repeat scroll 0% 0% ルールを削除する function deleteRule( index, sheetindex ) { if( sheetindex == undefined ) sheetindex = 0; document.styleSheets[ sheetindex ].deleteRule( index ); } 全てのルールにはインデックスが振られており、それを指定することでルールから消すことができる。 ただ、同じセレクタで上書きするのとほとんど変わらないので、あまり必要にならない
NYOKIGLITTER - Tab Styled Accordion
The First Box Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In tempus ante nec ipsum. In ut felis id leo aliquet euismod. In augue lorem, posuere eu, tincidunt non, bibendum quis, nisl. Integer erat erat, posuere vel, convallis feugiat, accumsan ac, sem. Sed scelerisque tortor nec leo. Etiam vel massa vitae nulla elementum aliquet. Donec egestas semper tellus. Donec ultrices ante cursu
ウィンドウサイズに合わせてCSSを変更できるdynamiclayout.js
ウィンドウサイズに合わせてCSSを変更できるdynamiclayout.js Dynamiclayout.jsはウィンドウサイズに合わせて読み込むCSSファイルを変更できるJavaScriptライブラリになります。 dを使用することにより、リキッドイアウトの幅を広げることが可能です。 設置方法 ダウンロードしたdynamiclayout.jsをhead要素などで読み込みます。 <script src="./dynamiclayout.js" type="text/javascript"></script> ウィンドウ幅に合わせたCSSファイルを用意します。 それぞれのCSSファイルを読み込む際にはtitle属性に ウィンドウ幅が750pxまでの場合の『thin』 ウィンドウ幅が950pxまでの場合の『wide』 ウィンドウ幅が950pxより大きい場合の『wider』 を付けて読み込みます。
クールにスライドするメニューを作成するJavaScriptライブラリ「Image Menu」:phpspot開発日誌
Image Menu クールにスライドするメニューを作成するJavaScriptライブラリ「Image Menu」。 メニューにカーソルを合わせると、カーソル部分がアニメーションしながら開くメニューを実装できます。。 画像を変えれば、よりクールなメニューを作れそうですね。 必要なJSライブラリ,CSSをインクルードした後、次のようなコードで簡単に初期化できる模様。 <h2>Example:</h2> <div id="kwick"> <ul class="kwicks"> <li class="kwick opt1"><span>Lanscapes</span></li> <li class="kwick opt2"><span>People</span></li> <li class="kwick opt3"><span>Nature</span></li> <li class="kwi
CSS レイアウト切り替えスイッチ | WWW WATCH
Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレ... Web サイトのレイアウトに関しては、横幅を固定した固定レイアウト、ブラウザのウィンドウサイズと連動するリキッドレイアウト、文字サイズと連動するエラスティックレイアウトの 3種類がよく使われますが、どのレイアウトが一番文章が読みやすかったり、利便性が高いのかって考えたときに、当然好みは人それぞれ。 じゃあ、その人の好みで、3つのレイアウトを切り替えられるようにしたらいいじゃんということで、そんな CSS 切り替えスイッチを作ってみました。 サンプルはこちらで確認できます 全ファイルのダウンロードはこちら （zip ファイル / 10KB） デフォルトでは横幅固定のレイアウトになっています。スイッチを押すたびにレイアウトが選択
CSS+JavaScriptで画像に柔軟なレイアウトを作る。（日本語訳） - Trans
著者: Aaron Gustafson件名: If I Told You You Had a Beautiful Figure...日付: 2007年9月25日URL: http://www.alistapart.com/articles/figurehandler訳者: Arata Kojimaその他: Translated with the permission of A List Apart Magazine and the author[s]. If I Told You You Had a Beautiful Figure... 率直に言って、画像というのは本当にイライラさせる。OK、ところで、たぶん画像自体が問題なのではない。しかし、画像をデザインの中でかちっとレイアウトするのは難しい。画像を使って、うまくコンテンツの意味を訪問者に知らせたいときは、特にそうだ。 もちろん、ちゃ
javascript タブUI導入の参考になるサイト - WEBデザイン BLOG
JavaScript でタブ切り替え UI を実装する | WWW WATCH(http://hyper-text.org/archives/2007/09/javascript_tab.shtml) のエントリーをみていいなコレっと思ったので、タブUI導入で参考になるいいサイトなんかを紹介してみたいと思います。 以前のエントリーブログGTD WEBデザイナー独立するために（その１） - WEBデザイン BLOG「jQuery・javascriptを使ってのさまざまなアプローチ方法を実践する」の中でとWEB標準でのC O U L D長谷川様の「解体Apple.com」のPDFを見て、ユーザーアプローチに使えるってことで紹介しようと思っていたネタです。実際に、自分サイトを立ち上げる時もタブの実装は考えていましたので今日の勢いで。 タブでもさまざまなタイプがあって、導入してみたいものと実際に使
これはかっこいいぞ・・・スライドショーに激しく使えるjQuery用プラグイン『jQuery Cycle Plugin』 | i d e a * i d e a
ドットインストール代表のライフハックブログ
[JS]jQueryで動作するlightboxのプラグイン -jQuery lightBox plugin
jQuery lightBox pluginは、画像の拡大表示ができるlightboxを実装できるjQueryのプラグインです。 jQuery lightBox plugin jQuery lightBox pluginの実装は、「jquery.js」と「jquery.lightbox-0.3.js」を外部ファイルとして参照し、その後に下記を記述します。
SWFObject v2.0 ドキュメント日本語訳 : Media Technology Labs (MTL) : メディアテクノロジーラボ ブログ
Ringとは、リクルートグループ会社従業員を対象にした新規事業提案制度です。 『ゼクシィ』『R25』『スタディサプリ』など数多くの事業を生み出してきた新規事業制度は、 1982年に「RING」としてスタートし、1990年「New RING」と改定、そして2018年「Ring」にリニューアルしました。 リクルートグループの従業員は誰でも自由に参加することができ、 テーマはリクルートの既存領域に限らず、ありとあらゆる領域が対象です。 リクルートにとって、Ringとは「新しい価値の創造」というグループ経営理念を体現する場であり、 従業員が自分の意思で新規事業を提案・実現できる機会です。 Ringフロー その後の事業開発手法 Ringを通過した案件は、事業化を検討する権利を得て、事業開発を行います。 さまざまな事業開発の手法がありますが、例えば既存領域での事業開発の場合は、 担当事業会社内で予算や
IT戦記 - 一行で IE の JavaScript を高速化する方法
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
Pure CSS Scrollable Table with Fixed Header
Also see the The Bullet Resistant Version :: Wider range of support and degrading of Browsers Browser Support (table is scrollable with fixed headers) Opera 7.x + (All Platforms) :: Tested with 7.2x and 7.5x Mozilla 1.x + (All Platforms) :: Tested with 1.0x and 1.6x IE 6.x + (Windows) :: Tested with 6.0x Safari 1.x + (MacOS) :: Tested with 1.2x Konqueror 3.x + (Linux / BSD) :: Tested with 3.2x Alm
fillinメッセージギミックを実現するjQueryの拡張プラグイン
【カカアコ ファーマーズマーケット2022】訪問記録まとめ！野菜・果物・美味しいパンにフレッシュチーズ♪【おすすめ】
[JS]フラッシュみたいな動きをする画像ギャラリー -jqGalView.js
jqGalView.jsは、フラッシュの画像ギャラリーにインスパイアされたスクリプトで、jQueryのプラグインです。 jQuery: jqGalView (Photo Gallery) jqGalViewは、Flash Image Galleryにインスパイアされて作成したもので、一度に大量のサムネイル一覧を切り替えることができます。 Flash Image Gallery
Flashムービーのサイズをブラウザ幅に応じて自動調整できるJSライブラリ「FitFlash」:phpspot開発日誌
FitFlash - Smart Flash Resize Script FitFlash is a smart script that resizes your flash automatically if your browser window size is smaller or greater than your flash minimum desired size keeping it accessible independent of screen resolution. Flashムービーのサイズをブラウザ幅に応じて自動調整できるJSライブラリ「FitFlash」。 通常、Flashムービー(SWF)はブラウザに貼り付けた状態だと固定サイズとなっています。 このムービーサイズをJavaScriptで動的にうまく調節できるライブラリがFitFlashです。 FitFlashは次
ライブドアブログ｜無料で豊富な機能が充実
【カカアコ ファーマーズマーケット2022】訪問記録まとめ！野菜・果物・美味しいパンにフレッシュチーズ♪【おすすめ】
min-width,max-width,min-height,max-heightをIEで使えるようにするjavascript[to-R]
min-width,max-width,min-height,max-heightをIEで使えるようにするjavascript minmax.jsはIE6以下でmin-width,max-width, min-height , max-heightのプロパティを利用可能にするjsライブラリになります。 CSS2では以下のプロパティが定義されているがIE6には実装されていない。 max-width - 要素の横幅の最大値を指定する min-width - 要素の横幅の最小値を指定する max-height - 要素の高さの最大値を指定する min-height - 要素の高さの最小値を指定する minmax.jsはこれらのプロパティを利用可能にするjsライブラリです。 設置方法 設置方法はダウンロードしたminmax.jsをhead要素内などで読み込むだけです。 <script type="
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.webcreativepark.net/cssnite/20071027/cssniteinosakavol7.pdf
https://www.ruzee.com/files/shadedborder/test.html
http://www.andreacfm.com/examples/jQpanels/