Home > JavaScript Archive

JavaScript Archive

グローバルナビ(画像ロールオーバー)のコーディング方法の考察

グローバルナビゲーションのコーディングはどういうものが最適なんだろうと思い考察メモ。

CSSの背景画像で作っていたけど印刷すると表示されないので、最近は<img>で表示したいなと思っています。

色々な情報を見つけたので記載。

…続きを読む >>

Popularity: 10% [?]

[Javascript]画像拡大はPopBoxがおすすめ

画像拡大表示としは、LightBoxが有名ですが、自分はギャラリーの時はいいかなと思うけど、ちょっとしたサムネイルの拡大表示はもっとサクッと表示してほしいと思っていて、それでおススメなのがこのPopBox。
サムネイル画像にオンマウスでカーソルがルーペになりわかりやす!

PopBox公式サイト

似たようなモノに、・Highslide.jsや・FancyZoon.jsがあるけど、非営利は無料だけど、商用サイトだと有料になるから使いづらい。

このPopBoxはフリーと書いてあったので、おそらく無料。自分はこれつかっていこ。

詳しくは、アークウェブさんのPopBoxの使い方にのってるので参照してください。

…続きを読む >>

Popularity: 54% [?]

[Javascript]6つのよく使う機能実装JSライブラリ

ASCII.jpさんで

Web制作会社が作った!超使えるJavaScriptライブラリ

の記事でミツエーリンクスさんがつくった「MJL(MITSUE-LINKS JavaScript Library)」が紹介されてた。

こんど使ってみようと思い引用メモ。

特徴

「必要最小限」の機能のみ実装

MJLは「必要最小限」と判断された、次の6機能を実装しています。

  • 画像のロールオーバー
  • Adobe Flashオブジェクト埋め込みの機能拡張
  • 新規ウインドウの作成
  • スタイルスイッチャの実装
  • タブインターフェイスの実装
  • 要素の高さ揃え

他ライブラリ非依存&共存・併用可能

MJLは他ライブラリに一切依存しません。
また、他ライブラリとの共存・併用が可能になっています。

一般的な特徴

次の特徴も持っています。
  • クロスプラットフォーム(Mozilla Firefox、Apple Safari、Opera、Internet Explorerのサポート)
  • 他ライブラリ非依存
  • 他ライブラリとバッティングしない名前空間
  • 生成コード・内部利用仕様のWeb標準準拠

…続きを読む >>

Popularity: 20% [?]

[Javascript]aタグで内容表示の切替とclassを変更する方法

JavaScriptを使って表示内容を切り替えるサンプルがKANTENNA.COMさんで掲載されていたので引用メモ。
getElementById()を使って指定IDのオブジェクトにアクセス。

<a>タグで内容表示切替サンプル


・SW1 ・SW2

これはSW1のエリアです。上記SW2をクリックすると消えます。

■コードは以下です。

<script language="javascript" type="text/javascript">
function Display(no){

 if(no == "no1"){

  document.getElementById("SW1").style.display = "block";
  document.getElementById("SW2").style.display = "none";

 }else if(no == "no2"){

  document.getElementById("SW1").style.display = "none";
  document.getElementById("SW2").style.display = "block";

 }
}
</script>

<a href="javascript:void(0);" onclick="Display('no1')">SW1</a>
<a href="javascript:void(0);" onclick="Display('no2')">SW2</a>

<div id="SW1">
<p>これはSW1のエリアです。上記SW2をクリックすると消えます。</p>
</div>

<div id="SW2" style="display:none;">
<p>これはSW2のエリアです。上記SW1をクリックすると消えます。</p>
</div>

<div>の中の<p>要素を表示非表示の切り替えをしてますね。

<a>タグで内容表示切替サンプル2

こちらは、<p>タグの内容もJSに入れて切り替える方法です。
■コードは以下です。

…続きを読む >>

Popularity: 41% [?]

[Javascript]透過PNG画像をIE6で適用させる

通常、IE6以下では透過PNGは使えなくて、透明度を設定した部分はグレーで表示されてしまう。IE独自のフィルター機能は意外とめんどー。
そこで、IE6で透過PNGを使えるようになるにJavascriptのライブラリがあります。

内容は以下です。

…続きを読む >>

Popularity: 52% [?]

Home > JavaScript Archive

ソーシャルメディア
NINJA TOOLS
最近の投稿
RSS ←WebmilkRSS購読
カテゴリー
プラグイン
天気

Return to page top