| ホームページの作り方のメニュー |
| 利用条件と著作権について |
| 共通プログラムと有料版について |
| 有料版の申し込みとお支払い |
| サンプル使用上の注意事項 |
| スライドショーとデータの記述方法 |
| Windows8のIE10の不具合について |
| 当サイトへのリンクについて |
| みやけ工房へのメール |
| ご意見・ご要望( 伝言板 ) |
| ホームページ制作代行(有料) |
| About me( Yahoo! プロフィール ) |
| INDEX |
| スライドショー・ギャラリー・ホームページのオリジナルJavascriptプログラム総合サイト | ||||
| Home | All Rights Reserved. Copyright (C) 2002- Miyake_kobo. | |||
| JavaScriptスライドショーサンプル集(汎用スライドショー) | スライドショーとギャラリーのテンプレート |
| コピーするだけでページにスライドショーを貼り付ける | ホームページ制作の小技集とテンプレート |
| ホームページのテンプレート集 | スライドショーの基本エフェクト見本 |
| 虫眼鏡撮影法 | その他のHP制作関連ページのメニュー |
| メニュー全体を閉じる | |
| 頻繁に使うスタイルシートと書き方 | HTMLタグ簡易リファレンス |
| JavaScriptでスタイルを変更する | ホームページの背景色見本帳 |
| ホームページの色を作る | スタイルシートで背景を作る |
| このメニューを消す | メニュー全体を閉じる |
| 以下は、「ホームページの作り方」で紹介しているサンプルを改良し、組み合わせて制作したページです。 | ||
|
|
|
|
| ★ 現在使用中のカメラ:CANON PowerShotA495(7,200円で購入)、PENTAX Optio RS1000(7,200円で購入)。 | ||
| このメニューを消す | メニュー全体を閉じる | |
| 共通プログラムと有料版について |
|
無料版(体験版)の共通プログラムとは、各サンプルプログラムの共通部分を別ファイルにしたもので、オリジナルのJavascriptライブラリーです。無料版サンプルは、この共通プログラムを外部ファイルとして私のサイトから読み込んでいます。 その為無料版は、プログラムの改良、サンプル解説ページの削除や移動や定期的な入れ替え、等が原因で使用できなくなります。 また、私の年齢は60台ですから、健康上の理由でサイトを閉鎖する可能性も無いとは言えません。 無料版で動作を試し、使用できることを確認した上で、完成ページには有料版を使用してください。 なお、無料版が削除されても、暫くは有料版を残してありますので、ご利用ください。 有料版とは無料版から著作権表記を削除し、プログラム本体をページ内に記述し、私のサイトへのアクセスを不要にしたものです。サイト内の全サンプルに有料版があります。 有料版の制作料金は特に金額の記述がないサンプルは1,000円、金額が記述されているサンプルはその金額になります。 制作する有料版のHTML部分には説明があり、デザインを改良し易く作ってありますが、スクリプトは圧縮タイプ(インデントと改行を削除)で説明もありませんので、スクリプトを独自に改良するには多少の慣れが必要になります。 また、[jQuery]の記述があるものは、有料版も外部ファイル(jQuery本体)を必要とします。 なお、[jQuery]はバージョンの違いにより内容が異なりますので、十分注意してください。 有料版プログラムは本体内に記述してありますが、外部ファイルにできる形式で書いてあります。ただし、外部ファイル制作にはHTMLの基礎知識が必要になります。外部ファイルを使用した経験のない方は、本体内に置いたまま使用してください。 外部ファイルの作り方の説明は致しません。 また、実際にWeb上にアップするファイルは、ソース中の「 //--- 書き換える部分↓ --- 」や「 <!-- ここからスライドショー。 --> 」などの説明文を削除してお使いください。 削除せずに使用すると誤動作の原因になる事があります。 無料版の共通プログラムは、文字コード「 ANSI 」(Shift_JISと同じ)で書いてあります。別の文字コードのページに読み込むときは、読み込み部分の <script type="text/javascript" src="〜"> を <script type="text/javascript" charset="Shift_JIS" src="〜"> と、Shift_JIS指定を書き加えてください。 有料版の改良代行は別料金になります。改良を希望される場合の追加料金の目安は ホームページ制作代行について(有料) をご覧ください。 ただし、改良料金が有料版代金の10倍以上になる事もあります。HTMLやスタイルシートによるデザインの変更などは、可能な限りご自身で行ってください。 |
| 閉じる |
| 利用条件と著作権について |
|
当サイトは、写真のスライドショーを中心にしたホームページのJavascriptプログラムを、種類別に分類して掲載しています。ただし、HTML、CSS、Javascript、DOM、Ajax、jQuery、などの解説を目的にしたものでも、素材の無料配布サイトでもありません。 全てのプログラムサンプルはフリーウェアではなくシェアウェアです。 また、サンプルを改良するにはHTMLやCSSの知識が必要になります。 サンプルの説明はWebデザイナー向けに書いてありますので、 ホームページ制作経験の少ない方には難解です。 掲載しているプログラムサンプルは、Windowsのインターネットエクスプローラ(IE)、ファイアフォックス(Firefox)、サファリ(Safari)、オペラ(Opera)、グーグル・クローム(Google Chrome)、で動作確認をしています。 しかし、あくまでサンプルの状態での動作確認であり、利用者が改良したり他のページに貼り付けたりする過程で、動作しなくなる事もあります。 最終的な動作確認はご自身でお願いします。 また、他のOS、古いバージョンのブラウザや、携帯・スマートフォンを含めた情報端末、ゲーム機などでの動作も、必要に応じて、ご自身で確認してください。 各プログラムサンプルにはそれぞれ無料版(体験版)と有料版があり、大部分の解説ページには無料版の使用方法が記述されています。 有料版のみのサンプルには、その旨記述があります。 無料版は、プログラム本体が私のサイトにあり、利用者はそれを共同で使用する形式で作ってあります。 有料版とは無料版から著作権表記を削除し、プログラム本体をページ内に移し、私のサイトへのアクセスを不要にしたものです。 詳細は、 共通プログラムと有料版について をご覧ください。 また、有料版の申し込みと支払いについては、 ここをクリック してください。 無料版の利用には以下の禁止事項があります。
なお、当サイト内の全てのコンテンツ、即ち、ホームページ・テンプレート・プログラム・写真・画像・文章、などの著作権は私が所有します。また、プログラムを使用(または改良して使用)して発生した不具合には、一切責任を負いません。 |
| 閉じる |
有料版の制作では、必ずお支払いの前に、無料版を使って動作が可能な事を確認してください。ご希望のOS、ブラウザなど、すべてをご確認ください。また、ご自身で使用できる事を確認してください。 改良や制作方法に関するアドバイスが必要な場合は 別料金 になります。
お申し込みは、メールにご要望のサンプル名とサンプルのURLを記述し、左の「みやけ工房へのメール」を参考にして送信してください。その際、必ずお名前(下記お振込み名義人)を書いてください。折り返し、振込先の口座、制作のスケジュールなどを返信します。
お支払いは銀行振り込みでお願いします。その際、振り込み手数料は皆様に負担していただきます。また、必ず上記「お名前」でお振込みください。
入金を確認できた日の翌営業日までに、私のサイトに有料版ソースと解説を記述した専用のページを作り、そのURLを連絡致します。 この専用ページは1週間後に削除します。専用ページを紛失された場合、再度購入して頂く事になりますので、必ずコピーをしてください。
お急ぎの場合はご連絡ください。私は若くはありませんので、「大至急」には対応できませんが、それなりに急ぎます。
銀行振込の場合、振込み金融機関発行の「ご利用明細」が税法上の「領収書」になりますので、私は領収書を発行いたしません。
| サンプル使用上の注意事項 |
|
ホームページ(HTMLファイル)はテキストファイルですから、「メモ帳」(Windowsの場合)などのテキストエディターで編集し、htmlまたはhtmという拡張子を付けて「名前をつけて保存」して作ります。 詳細は、 ホームページの制作方法とアップロード をご覧ください。 当サイトのテンプレートタイプのサンプルを使用する場合も、「メモ帳」を開き、サンプルのソースコードを貼り付けて「名前をつけて保存」して作ります。 また、当サイトの貼り付けるタイプや部品タイプのサンプルを、既存のホームページに貼り付ける場合も、貼り付けるホームページファイルを「メモ帳」で開き、サンプルのソースコードを貼り付け、「名前をつけて保存」してください。 その際、一つのHTMLファイル内に複数の文字コードが混在すると、「文字化け」や「誤動作」が発生する事があります。当サイトのサンプルは、特に記述がない限り、文字コードを「 ANSI 」(Shift_JISと同じ)で書いてあります。別の文字コードのソースに貼り付ける場合や、複数の場所から複数のソースを貼り合わせてページを作る場合、ページ全体を文字コードを統一して「名前を付けて保存」し直してください。 HTMLファイルの編集に、ホームページビルダーなどの編集ソフトを使用する場合や、ホームページ管理業者が提供する編集ページを使用する場合も、それぞれのヘルプ等を参照して「文字化け対策」を行ってください。 また、同じページ内に複数のJavaScriptプログラムがある場合、変数名や関数名などの重複により誤動作する事があります。重複した変数名や関数名などを変更してください。 ID名とクラス名で、ID名は固有の名前で、ページ内で唯一である必要があり、複数個存在すると誤動作します。クラス名は共通の性質を持つグループ名で、ページ内に複数個存在するものです。両者を混同しないように注意してください。また、サンプル内のクラス名を変更すると動作しなくなる事があります。 スライドショーの写真が表示されない方は、 パソコンが「拡張子を表示しない」設定になっていると、0.jpg と名前を付けたつもりでも、0.jpg.jpg と二重に拡張子が付いている可能性があります。写真ファイルを右クリックして「プロパティー」で確認してください。また、ファイル形式がJPG形式であること、拡張子が小文字であること、なども確認してください。 スライドショーに使用する写真の枚数は、20〜30枚を限度にする事をお勧めします。写真が多い場合は、複数のスライドショーを作り、小分けしてください。写真の大きさは、幅900高さ600ピクセル以下で作る事をお勧めします。 スライドショーを見るパソコンが大画面とは限りません。1024X768や1024X600の画面でも、頻繁にスクロールせずに見られる工夫が必要です。 IE6 Service Pack 2 以降では、パソコン内のJavaScriptを使用するファイルを開くと「警告」が発せられます。当サイトのサンプルをパソコン上にダウンロードしてパソコン上で開くと、この「警告」が出てしまいます。新たに開くたびに「ブロックされているコンテンツを許可(A)」してください。ただし、サンプルをWeb上にアップして開く場合は、この「警告」が出る事なく正常に表示されます。 ネットショップでサンプルを利用する場合、各ネットショップ運営業者の禁止事項等の規則のため、無料版に記載した制作方法ではプログラムを使用できない事があります。 規則をよく調べ、Javascriptプログラムの使用が可能ならば、無料版プログラムを使い、各ネットショップの独自の制作方法でページを作り、動作を確認してください。 その上で有料版をお申し込みください。 |
| 閉じる |
| 当サイトへのリンクについて |
|
私のサイト内のすべてのページはリンクフリーですが、可能な限り各カテゴリーのトップページへのリンクをお願い致します。ホームページテンプレートの個別ページのURLは断り無く変更する事があります。また、一部のサンプルスライドショーは構造上直接リンクする事が不可能です。なお、みやけ工房のGIFアニメーションやJPG画像をお使いになる場合は、以下をダウンロードしてご利用ください。
![]() <A href="http://www.geocities.jp/miyake_kobo/index.html"><IMG src="000s.jpg" onmouseover="this.src='ani000s.gif'" onmouseout="this.src='000s.jpg'" border=0></A> となります。 また、インラインフレームバナー をお使いになる場合、 <IFRAME src="http://www.geocities.jp/miyake_kobo/002.html?ffffff" scrolling=no frameborder=0 width=60 height=27 align="bottom" style="border:2px outset #ffffff"><A href="http://www.geocities.jp/miyake_kobo/index.html">みやけ工房</A></IFRAME> となります。バナーはインラインフレームを使用していますので一部表示できないブラウザがありますが、その場合通常のリンク みやけ工房 が表示されます。 src要素の ?ffffff はバナー内の背景色です。各要素は自由に変更してお使い頂いても結構です。 |
| 閉じる |
| みやけ工房へのメール | |
|
【メールを送信する前に】 原則として、無料版に関する質問にはお答えできません。無料版サンプルの使用方法は、左メニューの「サンプル使用上の注意」や「スライドショーデータの記述方法」を再度ご確認ください。 また、ホームページ制作の基礎的事項に関する質問もご遠慮ください。 メールには、「スライドショーについて」、「サンプルソースについて」などの明確なタイトルを付けて頂けると助かります。題名の無いメールや添付ファイルの付いたメールはご遠慮ください。返信は、このタイトルのRE.で送信します。 有料版のご依頼は、対象になるサンプルページのURL(アドレス)を明記してください。また、必ずお名前も明記してください。本名である必要はありませんが、振込みがある場合は振り込み名義人に使用できる名前にしてください。 なお、お使いのメールシステムが返信メールを受信可能である事、ご自身のメールアドレスが正しい事、を確認のうえ送信してください。メールソフトを使わずにWebメールで送信する方は、下のメールアドレスをコピーして使用してください。
|
|
| 閉じる |
| スライドショーとデータの記述方法 |
|
当サイト内のスライドショープログラムは2種類あり、何らかの操作をすると自動停止するタイプとしないタイプです。 前者は「start」「stop」ボタン、後者は「play」「pause」ボタンが使用されてます。 上記「play」「pause」ボタン型で自動スタート型のスライドショーの多くは、コントロールボタンのスタイルシートにdisplay:none;を書き加える事で、ボタンのない常時作動型に改良できます。その他の不要な部品(タイトルや小写真一覧など)もdisplay:none;を書き加える事で表示されなくなります。(不可能な部品もあります。) 「next」「prev」ボタンを連打した時に、表示が乱れる現象(写真の切り替え途中で次の切り替え動作に移行する為)を回避する目的で、当サイトのスライドショープログラムは、二種類の対応策を講じています。一つはボタンの二度押し防止タイプで、大部分のスライドショーはこのタイプです。もう一つは次の動作に移る前に表示を修正するタイプで、サクサク型やオンマウス型で使用しています。「next」「prev」ボタンを連打すればタイプの違いが確認できます。 写真データは必ず書き換えてからアップしてください。私の写真をそのまま使用すると誤動作する事があります。 なお、題名に「書き換え不要」「連番」などの表記があるものは、写真データを記述する必要はありません。 [A]や[IMG]などの表記があるものは、写真データがHTML部分にあります。以下を参考にして写真の枚数分を並べて記述してください。(クラス名が必要なタイプもあります。) 1)Aタグ形式 <A href="大写真ファイル名"><IMG src="小写真ファイル名" /></A> 2)IMGタグ形式(rel属性とsrc属性は逆の場合もあります。) <IMG src="写真ファイル名.jpg" /> または、 <IMG src="大写真ファイル名.jpg" rel="小写真ファイル名.jpg" /> 2)バナー形式(rel属性とsrc属性は逆の場合もあります。) <A href="開くページのURL"><IMG src="写真ファイル名.jpg" /></A> または、 <A href="開くページのURL"><IMG src="大写真ファイル名.jpg" rel="小写真ファイル名.jpg" />/A> スクリプト部分に写真データがあるものは、以下を参考にしてください。 ただし、サンプルにより必要項目の個数や順番は異なり、変数名や配列名に下記以外の名前を使用しているページもあります。 1)スライドショーでは、 photo[n]="写真ファイル名"; daimei[n++]="写真の題名やコメント"; 2)大小2枚の写真を使うギャラリーでは、 photo[n]="大写真ファイル名"; thum[n]="小写真ファイル名"; daimei[n++]="写真の題名やコメント"; 写真ファイル名は、写真がスライドショーと同じホルダーにある場合は「〜.jpg」などとファイル名だけを、別のホルダーにある場合は「../〜.jpg」(一つ上のホルダー)「../../〜.jpg」(二つ上のホルダー)などの相対表記で書いてください。また、一部のサンプルで使用している様に「http://〜」で始まる絶対表記でもかまいません。 また、題名部分はHTMLで文字を修飾する事ができ、コメントを書く事もできます。 |
| 閉じる |
| Windows8のIE10における不具合について |
|
マイクロソフトの主力OSがWindows7からWindows8に代わり、インターネットエクスプローラもバージョン9からバージョン10になりました。その際マイクロソフトは、インターネットエクスプローラの基本的な仕様を変更しました。 その為、一部のサンプルのプログラムを修正しなければならなくなりました。 もちろん、上記の環境で不具合が無い場合は修正の必要はありません。 有料版をお使いの方は
対象となるサンプルは、jQueryを使用しないタイプで、「透かし」「フェード」などスタイルopacityを使うものです。
これらを使わないタイプでも、jQueryを使用しないタイプは、念のために以下のコードが存在するか否かをご確認ください。
なお、修正作業の前に、必ずバックアップを残してください。
if(window.ActiveXObject){ という部分が通常は2箇所あると思います。 無い場合は修正の必要はありません。 これを、 if(kobo(this.id).filters){ に変更してください。以上で新旧両バージョンで動作します。 メモ帳などの「置換」を使えば、すぐにできると思います。この修正を実施しても上記の環境での不具合がある場合、または、修正したために他の環境で動作しなくなった場合は、メールでご連絡ください。私が修正します。 無料版をお使いの方は 上記環境で不具合がある場合は、有料版を購入するか最新バージョンのサンプルに入れ替えて、ページを作り直してください。 なお、無料版をお使いの方にはメールでの対応はできません。 |
| 閉じる |