JavascriptとCSSによる画像スライドショー(1)と同様に、Javascriptによるシンプルな画像スライドショーをもう1つ。

色々なスクリプトを取扱っているDynamicdriveからの抜粋です。
これまたシンプルで設置も簡単です。
スクリプト提供サイト
http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm
ページの説明文に従って、まずは
stepcarousel.js
jquery-1.2.6.pack.js
の2つのJavascriptをダウンロードし、
ページ内の説明文のStepに従い、ソースを記述すればOKです。
また、Javascriptに画像名を記述するのではなく、
<body>内に直接<img>タグで記述出来るので、
更新性にも優れているんじゃないでしょうか。
こちらもカスタマイズ次第では、写真の見せ方の幅がグン!と広がりそうなスクリプトですね。
http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm
Date :2009/6/10 21:03:04
Category :
javascript
Operation :
以前紹介したFLASHやJavascriptによる画像ギャラリー集の続きですが、今度はJavascriptとCSSによる画像スライドショーのスクリプトを色々探してみました。

まずはパッケージを丸ごとダウンロードして直ぐにでも動かしたい、
という場合に使えそうなシンプルなスライドショーから。
パッケージ配布場所
http://code.google.com/p/slideshow/
パッケージ配布先のURLより
Slideshow2r147.zip
をダウンロードして展開します。
このパッケージはあくまで基本機能だけ、という感じなので、
少々物足りないという方は、以下のサイトのように
キャプションを付けたり、画像にリンクを付けるなど、
諸々のカスタマイズが可能なようですので参考にしてみては。
http://www.electricprism.com/aeron/slideshow/
Date :2009/6/2 21:00:35
Category :
javascript
Operation :
どこかで見つけたJavascriptです。
(ソースの元がはっきりしないので僕が紹介するのもアレですが…)
これをはめ込むだけで実現可能なようです。
クリックした時は初期値の文字が消えるだけで、編集時の文字が消えないようです。
かなり使えます。
こんな感じです。
記入欄をクリックした時、初期値の文字が消えるJavascript
textareaforcus.js
Date :2009/1/13 23:53:10
Category :
javascript
Operation :
FLASHやJavascriptによる画像ギャラリーのご紹介第3弾。
今回でいったん打ち止めです。。。
xml_photo_gallery

galleria

imago

フォトアルバム

ザックリ探しただけでも、
かなりいっぱいありますね。
それぞれに特徴があって、
使い勝手も良さそうです。
FLASHやJavascriptによる画像ギャラリーのご紹介第2弾です。
Zen Flash Gallery

PhotoFlow Flash Gallery

df_xmlgallery

dfGallery

まだまだありそうなので、
続きはまたのご紹介にて。
「もっと画像をギャラリーっぽく、っていうか、
ダイナミックに見せたいよね。」
と、客の要望に慌てながら
色々ネットで探してみたら、
画像ギャラリー系のソフト(ツール)って
意外にいっぱい紹介されていますね。
FLASHありJavascriptあり。
内容も申し分ないくらい、
高機能なものまで色々あるみたいっす。
そんなFLASHやJavascriptによる画像ギャラリーを紹介します。
写真の見せ方に一工夫できそうなものばかりです。
(続きを読む…)
javascriptを使ってRSS Feedを表示可能にするツールです。ブログとコーポレートサイトが別々に分かれている企業サイトで「ブログの記事もサイト側に表示させたいんだが…というクライアントのお願いにも多少なりとも役に立つツール。
もちろん、他のお気に入りサイトのRSSフィードを自分のサイトなどに表示させることもできる。
これのいい所はカスタマイズがかなり楽な点ですね。
文字コードがやや厄介だが、euc、sjis、utfに各々適した文字コード変換も可能。
表示件数や表示文字数の調整も可能。
スタイル(css)の変更も可能。
と、
基本、フィードを表示させる点では問題なく使えるツールです。
表示は<div class=”rss-box”>や<li class=”rss-item”>などの形で返してくれるため、cssは外部ファイルから操作すればレイアウトの調整も可能になる。こりゃ便利です。
さらに設置やカスタマイズもかなり簡単で… (続きを読む…)
Date :2008/11/9 22:27:58
Category :
javascript
Operation :
デフォルトのGoogle支給のソースでは、idが「map」となっている所を、別の名前に変更すれば上手く表示されるようですね。
もちろん、HTML上で既に使用しているID名とかぶると当然ダメですが。
今回は「Gmap」というIDで対処すると、上手くIEで表示されました。
色々バグは起こるみたいなので、
文字コードの統一(HTMLファイルのcharsetとJavascriptの文字コードなどをすべて統一させる)などもきちんとさせた方がいいのかなと思います。
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("Gmap"));
map.setCenter(new GLatLng(35.658625, 139.745415), 16);
<div id="Gmap" style="width:500px; height:300px ">
</div>
参考サイト
Google MapsがIEで表示できない
http://ondes-martenot.info/blog/archives/2007/02/21_0124.php
ここまで<a href=”mailto:”>で記事を書いていきましたが、最終的にはこれしかないだろ(今のとこ)というやり方をご紹介します。
先のUTF-8では<a href=”mailto:”>でメーラーを起動させると件名などが文字化けするので回避策をの記事でWindowsはOKだけどMac.がダメじゃん…という問題を解決すべく、Javascriptを導入して<a href=”mailto:”>を動かしてみることにします。
これ、何がしたいかと言うと、JavascriptでUserAgentごとに
■Mac.の場合はsubject=以下をエンコード『しない』もの
■Windowsの場合はsubject=以下をエンコード『した』もの
を読み分けるということだけです。
具体的な記述はこんな感じになります。 (続きを読む…)
<a href=”mailto:”>に「件名」を入れる方法で前回紹介しましたが、この方法、例えばMovableTypeやWordPressなどを入れてUTF-8の環境下で動かしている時などは、メーラー起動時に文字化けを起こす厄介もの。WindowsでOutlookが起動する場合、subject=以下に記述した日本語が文字化けを起こします。ちなみにMac.だと問題なくメーラーが立ち上がり、件名も文字化けしないんですがねー…。ホンマに厄介。
そこで回避策として登場するのが、subject=以下Shift_JISでURLエンコードするという方法です。 (続きを読む…)