• ベストアンサー

画像と一緒にスライドするリンクを貼りたい

warpspaceの回答

  • warpspace
  • ベストアンサー率56% (83/147)
回答No.7

>最後の一枚だけ一行文の隙間が開いて、他とずれてしまいます。 次のように最後に1行追加してみてください。   <div id="makeMeScrollable">     <div style="float:left;width:500px;height:325px;padding:20px 20px;background:url(http://www.smoothdivscroll.com/images/demo/field.jpg)">       <a href="aaa.htm" target="_blank">aaaaaaaaaa</a><br>       <a href="aaa.htm" target="_blank">bbbbbbbbbb</a>     </div>     <div style="clear:both;"></div> ←これ!!!   </div> それでもダメであれば全体のソースを見ないと何とも言えませんので、差支えなければ そのページのURLを教えてください。

nanndabaneko
質問者

お礼

お早い対応ありがとうございます! 教えて頂いたタグをためしてみたのですが、確かに画像は全て上にそろってくれたのですが、最後の画像の右横に何もない空間が丁度画像一個分ほど空いてしまいました。 現在はまだその方法がわからず作れていないのですが、このスライドは、スクリプト元のDEMOスライドのようにループになるようにしたいと考えているので隙間はどうにか埋めたいところです。 こちらがclear:bothをためさせて頂いたページです:http://nanndabaneko.web.fc2.com/index.html こちらがclear:bothを入れる前のページです:http://nanndabaneko.web.fc2.com/index2.html 先ほど気づいたのですが、どうやらE6だと最後の画像にでる上の隙間の不具合はでないようです。 Google ChromeやFirefoxの場合に起こるようでした。 下の二つのどちらかでも、上手く表示されてくれれば良いのですが・・・。

関連するQ&A

  • 背景画像のスライドショー

    Jqueryのプラグインで背景画像をフルスクリーンでスライドショーを行うものはよく見かけますが、 フルスクリーンにしないで、設置した背景画像の大きさのままスライドショーを出来るプラグインなどをご存知でしたらご教授いただきたいです。 もしくは、 下記プラグインの利用などを検討していたのですが、 このプラグインのどこの設定を変更すれば、フルスクリーンにはならなくなるのか、 ご教授いただけたら幸いです。 利用を検討していたプラグイン http://srobbin.com/jquery-plugins/backstretch/

  • リンクを押してスライドを出現させる方法

    リンクをクリックしたときに、新しいページに飛ぶのではなく、画面の上にスライドを表示させる方法を教えて下さい。 ギャラリーなどでよくある、サムネ画像をクリックすると上にふわっと出現するもののスライド版を作りたいと思っています。 スライド自体は作れているのですが、それをどうやったらリンクを押したときに画面上に出現させることができるのかわからず悩んでいます。 下の参考画像のように、元のページが一段階暗くなり、上に出てくるというものです。 スライドは、画像がフェイドアウトして新しい画像がフェイドインするようなタイプではなく 画像が横スライドして新しい画像に入れ替わるタイプです。 また、元のページ自体がまたスライドなのですが、一つのhtmlに複数のスライド用のjQueryをつないだ場合、ごちゃごちゃに反応してしまうでしょうか。 どなたかご教授お願いいたします。

    • ベストアンサー
    • HTML
  • jQuery等で背景をフル表示+スライドショー

    http://www.daichifive.com/ ↑のサイトのような感じに背景を画面サイズに合わせてフル表示にし、 サムネイル出して、クリックすれば、次の画像に切り替えたいと思っています。 画像は3枚で、3枚目の画像だけ、縦長になっているので、 背景が3枚目になったときだけ縦スクロールバーを付けて、 上から下まで見れるようにしたいです。 サムネイルを出して、次の画像に切り替えるくらいですと、 jQueryを探せば何かあると思うのですが、 3枚目だけ縦スクロールバーをつけることなどできるのでしょうか。 できるとすれば、どのjQueryを使って、どうゆうカスタマイズをすればできるのでしょうか? jQuery以外の方法でも、上記のような動きを実装できるやり方があれば ご教授いただけないでしょうか。 よろしくおねがい致します。

    • ベストアンサー
    • CSS
  • jQueryスライドショー画像へのリンク設置

    お世話になります。どうぞよろしくお願い致します。 こちらのページを見て、この通りコピペと編集をし jQueryを使って、スライドショーを作成しました。 http://black-flag.net/jquery/20110525-3120.html ここに6枚画像を設置し、スライド自体はうまく動かすことができました。 この6枚の画像にそれぞれリンクを張りたいのですが、 普通に<a href=""></a>で貼っただけではうまくいかず、 何か方法はありますでしょうか。 どうぞよろしくお願いします。

  • スライドショーで画像にリンクを貼る方法

    http://luxnate.com/memo/2011/02/-flash30.html こちらのスライドショーを使ってスライドショーを作りました。 画像1枚1枚に違うリンク先をつけたいのですが、すみません、分かりません(^^; xmlを修正するのかなと思い、こちらで質問しました。 ぜひ宜しくお願いいたします。

    • ベストアンサー
    • XML
  • 背景色と連動するスライドショープラグイン

    お世話になります。 スライドの画像が変わるたびに背景色も変わるタイプのスライドショープラグインを探しています。 サンプルとして http://elegantthemes.com/preview/eStore/ こちらのサイトの様な感じにしたいと思っています。 中央部分がスライドショーになっており両サイドが背景となっているようです。 ソースを見てみるとslideというクラスがついた要素全体をスライドするようです。 画像だけでなく文字や背景も変わっています。 ようはインラインコンテンツそのものをスライドするタイプのものであれば良いのかなと思います。 lightboxのようなイメージギャラリーですとインラインコンテンツを表示するタイプのものがありますが、単純にフェードインアウトするスライドショーでインラインコンテンツをスライドさせるものは無いでしょうか? もしくは簡単なjQueryで出来そうならご教授願いたいと思います。

  • jQuery背景画像動かすパララックス

    http://yuki930.v-colors.com/ このサイトの背景画像を作りたいです。 ですが、まず画像背景の作り方がわかりません。 それとマウスを動かすと立体的に動く仕組みのやり方がわかりません。 (上のサイトは少し弧を描くように回転しています。) 検索で探しましたところこのようなものがヒットしました。 マウスの動きに追従して奥行きのある背景移動をするjQueryプラグイン「jquery.parallax.js」 http://www.webopixel.net/javascript/381.html たぶんこれであってると思います。 一回違うやつを作ってみました。 jQuery/CSS3で雲をゆらゆらさせる http://www.webopixel.net/javascript/718.html しかし、背景が透明にならず重なってしまいました。(Javasucriptのほうはうまく組み込めました。) まず、背景画像を透明にするやり方が一点と 次に、マウスを動かすと背景が立体的に弧を描くようにするやり方 以上二点を教えて頂きたく存じます。何卒よろしくお願い申し上げますm(_ _)m

  • ダイナミックテキストを、ムービークリップと一緒に移動。

    動かない背景の上を、スライドして、別の背景を動かすのですが、別の背景の上には、テキストを読み込むダイナミックテキストが乗っています。 スライドする方法は、ActionScriptで、できました。 また、その上に乗っているダイナミックテキストをスライドする方法も、ActionScriptに位置の変数を設定すればいいのですが・・・ もっとActionScriptを使わずに、レイヤーの上に乗っているダイナミックテキストを、一緒に移動させる設定とかはないのでしょうか?

  • JQuery リンク設定方法について

    JQueryのリンク設定方法についてご教授いただけると幸いです。 ■内容 以下のアドレスにあるJQueryですが、リンクをクリックしたときにリンク先へページ移動する設定をご存じの方ご教授いただけると幸いです。 http://www.wizzud.com/jqdock_examples_folder/example.submenus.html 例えばsub-option L1をクリックするとyahooページに移動するという意味です。 単純にhtmlでリンク設定しても駄目でした。 元ページ http://www.wizzud.com/jqdock/examples/ 宜しくお願い致します。

  • JQueryのスライドショーを停止させたい

    サイトの背景画像のスライドショーを「VEGAS BACKGROUND JQUERY PLUGIN」を利用して行いたいのですが、スライドショーを1回で停止(ループさせない)ようにしたいのです。 どこをいじってもうまくいかなく困っています。 お教えいただけないでしょうか? http://vegas.jaysalvat.com/ (SLIDE SHOWを利用しています。) よろしくおねがいします。