2012-02-02 19 views
-1

友人のためのウェブサイトを構築しています。現在、jquery-1.4.3.min.js、corners.js、equalcols.js、頭にイメージ・スクリプトをロードします。すべて素晴らしいです。私のページで複数のスクリプトタグが機能していない

問題は、ページのFancyBox(ライトボックスの代替)が必要になり、動作しないようです。私はそれが何か他のものと競合していることがわかっているが、私は何が分からない。それは頭の中の命令ですか?または、他の何か? LightBoxを試しても動作しません。

EqualCols.jsが機能しない、または他のすべてが必要なミニ画像ギャラリー用のFancyBoxを除いて動作します。

ヘッドコードは以下の通りです:(そこにFancyBoxなし)

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Untitled 1</title> 
    <link rel="stylesheet" href="styles.css" type="text/css" /> 
    <script type="text/javascript" src="js/jquery-1.4.3.min.js"></script> 

    <!-- PRELOAD MENU IMAGES BEGINNING --> 
    <script> 
     var myimages=new Array() 
     function preloadimages(){ 
     for (i=0;i<preloadimages.arguments.length ; 
     i + myimages [ i ] =new Image (myimages [ i ] 
     src=preloadimages.arguments[i] } Enter path of images to be preloaded 
     inside parenthesis. Extend list as desired. preloadimages (images/
     home-h.png " images/about-h.png " images/services-rates-h.png " 
     images/past-work-h.png " images/contact-h.png " images/
     shop-specials-h.png " images/free-quote-h.png " images/
     book-now-h.png ") 
</script> 
    <!-- PRELOAD MENU IMAGES END --> 

    <!-- stop curvery corners error in IE --> 
    <script type="text/javascript" src="js/corners.js"></script> 
    <script type="text/javascript"> 
     var curvyCornersVerbose = false; 
    </script> 
    <!-- stop curvery corners error in IE --> 

    <!-- EQUAL COLS START --> 
    <script src="js/equalcols.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#left-col,#right-col').equalCols(); 
     }); 
    </script> 
    <!-- EQUAL COLS END --> 

</head> 

です私はすべてが動作するためにコーディングFancyBoxを配置する必要があるだろう場所を教えてくださいすることができ、誰?それを稼働させるために何ができるのですか?ルールは何ですか?私はGoogleで研究してきたが、私は後に答えを見つけることができないようだ。

私が実装する必要がFancyBoxコードは次のとおりです。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script> 
<link rel="stylesheet" href="/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" /> 

が、私はこのすでに使用している場合は?:

<script type="text/javascript" src="js/jquery-1.4.3.min.js"></script> 

すべてのヘルプははるかに高く評価私が一番上の行が必要です。

答えて

1

は交換してください:

<script type="text/javascript" src="js/jquery-1.4.3.min.js"></script> 

で:

<link rel="stylesheet" href="/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" /> 
<script type="text/javascript" src="js/jquery-1.4.3.min.js"></script> 
<script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script> 

Fancyboxコード:コードの下

$(document).ready(function() { 
    $('#single_image').fancybox(); 
}); 
+0

まだ試してみましたが、うまくいきませんでした - ( ここでは、イメージのために私が使用しているのは、FancyBoxのウェブサイトです。画像。 nzhardcore

+0

"single_image"が何をしているのか分かりませんが、これはFancyBoxのウェブサイトのHow-To-Useページに記載されています。 – nzhardcore

+0

本当に、私は自分の答えを更新しました! – sally

1

は、サンプルを働いている - fancyboxはiframeバージョンを。 はインクルードが

<script type="text/javascript" src="/js/jquery/fancybox/jquery.easing-1.4.pack.js"></script> 
<script type="text/javascript" src="/js/jquery/fancybox/jquery.mousewheel-3.0.4.pack.js"></script> 

/** jQueryのレディ機能が */ を次のようにブロックがある含め、あなたのHTML/JSP

 <!-- The popup iframe . The href value will be updated dynamically --> 
<a class="iframe" id="iframe" href="/YourApp/imagePopup.do"></a> 

でアンカータグを追加していることを確認してください$(document).ready(function(){

// popup for showing 
$("a.iframe").fancybox({ 
    'autoDimensions':false, 
    'width'     : 770, 
    'height'    : 'auto', // height is controlled using jquery.fancybox-1.3.4.css line 79 
    'centerOnScroll' : true, 
    'scrolling':'auto', 
    // 'autoScale': true, 
    'hideOnOverlayClick' : false, 
    'enableEscapeButton' :true, 
    'hideOnContentClick': false, 
    'type':'iframe' 
    ,'onStart' :function(){$.fancybox.showActivity();} 

    ,'onClosed' :function(){ } 
    }); 

}); //終了準備完了

+0

答えをいただきありがとうございますが、iframeを本当に使いたくはありません。 なぜ私はそれをそのまま使用することができないのか知っていますか? 友人はそれが頭の中のjsの順序のためだと言いましたが、私はそれがどの順序にある​​べきかを理解できないようです! – nzhardcore

関連する問題