什麼做錯了？

所以，我有一個簡單的模態窗口應該顯示一個由動態內容組成的javascript畫廊。我創建了一個簡單的PHP文件什麼做錯了？

測試文件：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 

<link href="css/jqModal.css" rel="stylesheet" type="text/css" /> 
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> 
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script> 
<script type="text/javascript" src="js/jqModal.js"></script> 
<link rel="stylesheet" href="css/featureCarousel.css" charset="utf-8" /> 
<script src="js/jquery.featureCarousel.js" type="text/javascript" charset="utf-8"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
         //this function should open Modal window and load shirts.php 
       $('#dialog').jqm({ajax: 'shirts.php'}); 

      }); 
     // once shirts php is loaded and ready, this function should give content is animation and behavior 
      $('#featureCarousel').ready(function(){ 
       $("#featureCarousel").featureCarousel({ 
        // include options like this: 
        // (use quotes only for string values, and no trailing comma after last option) 
        // option: value, 
        // option: value 
       }); 

      }) 
     </script> 


</head> 

<body> 
<a href="#" class="jqModal">view</a> 
<div class="jqmWindow" id="dialog"> 


</div> 

</body> 
</html>

Shirts.php：

<?php require_once("includes/connection.php"); ?> 
<?php $query = mysql_query("SELECT * FROM products WHERE category=3"); ?> 

<div id="featureCarousel"> 
<?php 
    while($product_set = mysql_fetch_assoc($query)) { 
     print "<div class=\"feature\" \"><a href=\"javascript:void(0)\" id=" . $product_set['products_id'] . "><img alt=\"Image Caption\" src=" . $product_set['products_image'] . "></a><div><p>This is some information that can go along with an image. 
      Anything can be placed here, including images.</p></div></div>"; 
    } 
?> 
</div>

CSS的模式：

.jqmWindow { 
    display: none; 

    position: fixed; 
    top: 17%; 
    left: 50%; 

    margin-left: -300px; 


    background-color: #EEE; 
    color: #333; 
    border: 1px solid black; 
    padding: 12px; 
} 

.jqmOverlay { background-color: #000; } 

/* Background iframe styling for IE6. Prevents ActiveX bleed-through (<select> form elements, etc.) */ 
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1; 
    width: expression(this.parentNode.offsetWidth+'px'); 
    height: expression(this.parentNode.offsetHeight+'px'); 
} 

/* Fixed posistioning emulation for IE6 
    Star selector used to hide definition from browsers other than IE6 
    For valid CSS, use a conditional include instead */ 
* html .jqmWindow { 
    position: absolute; 
    top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight)/100) + 'px'); 
}

的CSS畫廊

/******************** 
* FEATURE CAROUSEL * 
********************/ 
#featureCarousel { 
    height: 380px; 
    width:960px; 
    position:relative; 
} 
#featureCarousel img { 
    border:0; 
} 
#featureCarousel .feature { 
    position:absolute; 
    top:-1000px; 
    left:-1000px; 
    border:3px solid white; 
    cursor:pointer; 
} 
#featureCarousel .feature > div { 
    position:absolute; 
    bottom:0px; 
    left:0px; 
    background-color:black; 
    width:100%; 
} 
#featureCarousel .feature > div p { 
    margin:0; 
    padding:5px; 
    font-weight:bold; 
    font-size:12px; 
    color:white; 
} 
#featureCarousel .blipsContainer { 
    position:absolute; 
    color:white; 
    right:25px; 
    top:310px; 
    padding:0; 
    margin:0; 
} 
#featureCarousel .blipsContainer .blip { 
    margin:3px; 
    height:14px; 
    width:14px; 
    color:white; 
    text-align:center; 
    font-size:10px; 
    border:1px dotted black; 
} 
#featureCarousel .blipsContainer .blipSelected { 
    color:white; 
    font-weight:bold; 
    background-color:black; 
}

當我加載我的index.php時，模態打開併爲空。所以我回顧了源代碼;這表明所有內容都是正確生成的。但由於某些奇怪的原因，這是不可見的。

我在做什麼錯？

http://suit-brokers.com/modal_test/modaltest.php

來源

2011-01-21 E.E.33

你能提供一個網址，所以我們可以看到這在行動？ – 2011-01-21 05:15:46

http://suit-brokers.com/modal_test/modaltest.php – 2011-01-21 06:23:44

您#featureCarousel .feature風格featureCarousel.css有讓您的內容不可見一些極端負面的位置。也許改變你的風格一點，所以他們不是-1000px頂部/左側這個頁面的某處，你的問題將得到解決。

來源

2011-01-21 06:32:41

什麼做錯了？

回答

相關問題