• ベストアンサー

クロースフェードとライトボックスの組み合わせ

プログラム初心者です。 jQueryで出来るクロスフェードと、同じくjQueryのライトボックスは組み合わせる事が可能でしょうか? クロスフェードしている画像をクリックするとライトボックスが稼働するというものを作りたいのですが、組み合わせるとクロスフェードしなくなるので無理なのかと。 もし出来るとすればサンプルがあると大変ありがたいのですが。 いかがでしょうか。

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

>組み合わせるとクロスフェードしなくなるので無理なのかと ライトボックスは使ったことありませんが、おかしなことをやっているとは思えませんので、干渉しないようにしておきさえすれば動作するのではないでしょうか? 試しに、ごく簡単な例を。 画像を重ねているので、ほとんど見えていない状態でも上にある物をクリックしたことになります。 (全角空白は半角に) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>test</title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen"> <style type="text/css"> <!-- #hoge, #hoge li { list-style-type:none; margin:0; padding:0; } #hoge { postion:relative; } #hoge li { position:absolute; top:0; left:0; display:none; } #hoge img { width:300px; height:150px; } //--> </style> <script type="text/javascript" src="js/jquery-1.5.2.min.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.min.js"></script> <script type="text/javascript"> <!-- $(function(){  var pointer = 0, max = $("#hoge li").length;  $("#hoge li:first-child").clone(true).appendTo($("#hoge")).show();  var interval = setInterval(function(){   pointer = ++pointer % max;   var selector = "#hoge li:nth-child(" + (pointer+1) + ")";   $("#hoge li:visible").fadeOut(1500, function(){ $(this).remove(); });   $(selector).clone(true).appendTo($("#hoge")).fadeIn(2000);  }, 2500);  $('#hoge a').lightBox(); }); //--> </script> </head> <body> <ul id="hoge"> <li><a href="img/photo01.jpg" title="fuga1"> <img src="img/photo01.jpg" alt="fuga1"> </a></li> <li><a href="img/photo02.jpg" title="fuga2"> <img src="img/photo02.jpg" alt="fuga2"> </a></li> <li><a href="img/photo03.jpg" title="fuga3"> <img src="img/photo03.jpg" alt="fuga3"> </a></li> </ul> </body> </html>

market03988
質問者

お礼

スイマセン間違えてました。Lightbox JS v2.0はjQueryですね。 どうやら組み合わせが出来ました。 ありがとうございます。

market03988
質問者

補足

ご回答ありがとうございます。 書き忘れて恐縮なのですが jQueryではないライトボックス(Lightbox JS v2.0とか)は組み合わせる事が可能でしょうか? よろしくお願いします。

すると、全ての回答が全文表示されます。

関連するQ&A