- ベストアンサー
数枚のバナーが入れ替わるライブラリーを作りたい
6枚あるバナーが順番に表示されていき、その横にある小さい画像に触れると そのバナーに戻るみたいな、ライブラリーが作りたいのですが。 説明するのが難しいので、 http://www.selecsonic.com/selecsonic/top/index.jsp こちらの参考サイトのトップページのイメージバナーを見て下さい。 これとまったく同じものが作りたいのです。 jqueryだと思いますが、どれを使ったいいのかわかりません。 それとも自作になるのでしょうか？ 宜しくお願い致します。
- peco33
- お礼率79% (123/154)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
#1です。 ＞大きい画像は自動再生されないみたいですが… オプションで自動再生もあるみたいです。 対象部分の見え方が違いますが… http://flowplayer.org/tools/demos/scrollable/plugins/index.html#autoscroll （↑）の部分は、ボタンを押すと自動再生、その一つ下の例では最初から環状につなげて自動再生になっていませんか？ 制御部分だけは作成しなければならないでしょうが、APIが用意されているので、0から作成するのに比べれば遥かに簡単かと。
その他の回答 (1)
- fujillin
- ベストアンサー率61% (1594/2576)
上の方のスクロールするナビ部分のことですよんね？ ご提示のサイトではjquery.toolsを使用しているようなので、それを利用しているのかと思いましたけれども、どうやらそれは別のところで使っているようで、mainImage.jsにほとんどの処理が記述されているみたい。（ちゃんと見てませんが） とりあえず、そのあたりのソースコードがご参考になるかと… 最初に上げたjquery.toolsでもほぼ似たようなことが可能だと思いますが…（確認してませんが） jquery.toolsのデモ http://flowplayer.org/tools/demos/scrollable/site-navigation.html ご提示のサイトでは、サムネールにマウスオーバーでメイン画像が横スクロールに対して、 （↑）のデモではサムネールをクリックするとメインの画像が縦スクロールします。 縦/横、マウスオーバー/クリックの違いはありますがほとんど同じ処理といえます。 スクロール方向はライブラリのオプションで制御できるようですので、イベントのトリガー部分だけセットすることで同様のことができそうに思えます。 http://flowplayer.org/tools/scrollable/index.html#features
お礼
ありがとうございます！ 確かにこれはかなり近いですね。 大きい画像は自動再生されないみたいですが… あと配置はCSS次第ですかね。
関連するQ&A
- 数枚のバナーが一定の間隔でスクロールするライブラリ
数枚のバナー（仮に6枚）が一定時間でスクロールして入れ変わるライブラリを作りたいと思っています。 またメインバナーの横には小さいサムネールもあり、ロールオーバーでメインの画像がそれになるようにしたいです。 説明では難しいのでこちらを見て下さい。 http://www.selecsonic.com/selecsonic/top/index.jsp まさにこんな感じのものが作りたいです（全く一緒にしたい。画像は4枚verにして） html、cssの知識はありますがこういったものが全く疎いのでご教授下さい。 jqueryですよね？ ポイントは 1、自動再生、一定時間でスクロール 2、サムネールをロールオーバーでメインがそのバナーまでスクロール ３、バナーをクリックでリンク先へ移動（メイン、サムネール共に） ４、ページを読む込むたびに開始位置ランダム（これはできたらでいいです） 以上です。 お願いします。
- ベストアンサー
- JavaScript
- バナーの作り方を教えてください。
はじめまして。 バナーというかTOPページからリンクできる画像をつくりたいのですが、これはどのようにしてつくればいいのでしょうか？ 現在、photoshopとillustratorを持っています。 以下の参考サイトのTOPページの上のほうの大きな画像のようなものを作りたいと考えています。 基本的なphotoshopの技術で作れるものでしょうか？ 毎度、初心な質問で大変申し訳ないのですがどうかよろしくお願いいたします。
- ベストアンサー
- グラフィックソフト
- バナー等の画像に使える模様の作り方を教えてください。
いつもお世話になります。 現在、photoshopとillustratorを所有していまして、このたびバナー等の画像に使える汎用性の高い模様を作りたいと考えております。 そこで、下のサイトのTOPページの花柄の模様などの作り方を教えていただけないでしょうか？ http://www.la-celeb.com/index.html
- ベストアンサー
- グラフィックソフト
- こんなバナーの作り方
Flashは初心者の為、分かりやすく教えて頂けると助かります。 下記サイトTOPページのようなマウスで切り替わるバナーを作りたいのですが 初心者でも分かりやすく説明されているサイトなどありませんか？ ソフトはAdobeFlashCS3があります。 サンプルをダウンロードしてもいじり方がイマイチ分かりません… どなたかご教授いただけると助かります。 宜しくお願いいたします。 http://www.s-hoshino.com/
- ベストアンサー
- Flash
- バナーが表示されません。
初めまして。 自分のHPにバナーを張るとちゃんと表示されるのですが,「総合検索エンジン」などで新規登録する時にバナーアドレスを入力し、確認ボタンを押してもきちんと表示されないページがあります。（表示されるページもありました。） トップにある画像のアドレスを試しに入力するときちんと表示されます。 そのバナーはトップに置いていないんですが、トップにおかなければ表示されないんでしょうか。 画像のURLもちゃんとhttp://～から始まっていますし、アップロードもしてあります。 ちなみに忍者ツールを使っています。 よろしくお願いします。
- ベストアンサー
- その他（インターネット・Webサービス）
- バナーフラッシュの作り方を教えて
こんにちは。 下記のサイトのようなフラッシュを自作したいのですが、 作り方がわかりません。 http://www.st-image.com/ ・大きなバナーは自動的に数秒ごとに切り替わり、 クリックするとリンク先ページへジャンプする。 ・ミニバナーをクリックすると、大きなバナーが切り替わる。 この作り方が載っている、ウェブページか本を教えてください。 ソフトは、Adobeのフラッシュのソフトを持っていますが、 買ったきり使い方がわかっていません。 他のソフトへの乗り換えでもOKですので、 なるべく簡単なものを教えてください。 ほかのフラッシュは作る予定がありませんので、 今回のケースだけで考えてよいです。 よろしくお願いいたします。
- 締切済み
- Flash
- 透明バナーの作成方法
HPを作成しています。 TOPページのメイン画像の上に透明のバナーを貼り、 そこにリンクを貼って別のページに飛ばす、 と言うことをしたいと思っています。 そのときバナーは透明ですが、影で浮き上がらせているようにし 何か押下できるものがあるんだ、と言う感じにしたいです。 バナーはFireworks4で作成しています。 レイヤーの透過を０に近い数字に設定し、ドロップシャドウで影をつけてます。 そこまでは良いような気がしていたのですが、 いざ書き出してみると影の周りに白く縁ができ、下にある画像となじみません。 書き出しの時にインデックス透明カラーを設定しても同じです。 このような時、何か別の方法があるのでしょうか？ ソフトはFireworksを使っていますが、photoshop・Illustratorもバージョンは古いですが持っています。 ３つのいずれかのソフトでメイン画像がきれいに透けて見え、 影もけっこうはっきりついて浮いて見えるバナーの作り方を教えてください。
- ベストアンサー
- グラフィックソフト
- バナーのURLについて
超初心者です。 ＨＰを作ったので検索エンジンに登録しようとしたところ、「タイトルバナーのURL」を書き込む欄がありました。 イラストレターでバナー用に作成した画像をトップページに貼り付けてあります。 ただの画像を貼り付けただけなので、ＵＲＬなどありません。 タイトルバナーのURLってなんですか？ バカな質問かもしれませんが宜しくお願いいします。
- ベストアンサー
- HTML
- jQueryにて複数ライブラリを動かす
wordpressにてWEB制作を行っています。 jQueryにてfullpage.jsというフルページスクロールするライブラリを使用しております。 そのセクションの一つをfullpage.jsの機能の一つ横スライドを行っているのですが、 fullpage.jsのオプションには自動再生はありません。 スライド部分のみ自動再生を行いたいので bxslider.jsというライブラリを使用し、 横スライドしたいセクションをbxsliderで動かしたいのですが、 bxsliderが全く作動しません。 また <script type="text/javascript"> jQuery(document).ready(function(){ jQuery('.bxslider').bxSlider(); }); </script> の記述を <script type="text/javascript"> jQuery(document).ready(function() { jQuery('#fullpage').fullpage(); }); の上に書くと今度はfullpageが動きません。 jQueryライブラリは同ページで二つ同時には動かないんでしょうか？ また、書き方が間違っていますでしょうか？ 宜しくお願い致します。
- 締切済み
- JavaScript
お礼
ありがとうございます。 2つを組み合わせですね。 正直知識があまりないもので、素人でも組み立てられるかちょっと…^^;