2013-04-11 85 views
0

我有SlidesJS工作,但由於某種原因,它認爲框架比他們大。因此,如果我將幻燈片放在4段中,幻燈片仍佔據了大部分頁面。調整大小SlidesJS幻燈片

我嘗試在底部的腳本中放入較小的寬度和高度值,但它似乎沒有任何區別。

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>SlidesJS Standard Code Example</title> 
    <meta name="description" content="SlidesJS is a simple slideshow plugin for jQuery. Packed with a useful set of features to help novice and advanced developers alike create elegant and user-friendly slideshows."> 
    <meta name="author" content="Nathan Searles"> 

    <!-- SlidesJS Required (if responsive): Sets the page width to the device width. --> 
    <meta name="viewport" content="width=device-width"> 
    <!-- End SlidesJS Required --> 

    <!-- CSS for slidesjs.com example --> 
    <link rel="stylesheet" href="css/example.css"> 
    <link rel="stylesheet" href="css/font-awesome.min.css"> 

</head> 
<body> 

    <!-- SlidesJS Required: Start Slides --> 
    <!-- The container is used to define the width of the slideshow --> 
    <div class="container"> 
    <div id="slides"> 
     <p>Hello</p> 
     <p>Hello1</p> 
     <p>Hello2</p> 
     <p>Hello3</p> 

     <a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left icon-large"></i></a> 
     <a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right icon-large"></i></a> 
    </div> 
    </div> 
    <!-- End SlidesJS Required: Start Slides --> 

    <!-- SlidesJS Required: Link to jQuery --> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <!-- End SlidesJS Required --> 

    <!-- SlidesJS Required: Link to jquery.slides.js --> 
    <script src="js/jquery.slides.min.js"></script> 
    <!-- End SlidesJS Required --> 

    <!-- SlidesJS Required: Initialize SlidesJS with a jQuery doc ready --> 
    <script> 
    $(function() { 
     $('#slides').slidesjs({ 
     width: 94, 
     height: 52 
     }); 
    }); 
    </script> 
    <!-- End SlidesJS Required --> 
</body> 
</html> 

回答

0

example.css中的CSS可能會覆蓋您在腳本中設置的寬度和高度。嘗試調整CSS中的寬度和高度。

+0

我試圖徹底刪除CSS,並使問題變得更糟!我不知道要編輯哪部分CSS。我會認爲在他們的網站上他們會說如果需要CSS來編輯幻燈片的大小。 – PriestVallon 2013-04-11 20:42:58

1

更新:我發現它是example.css中的響應css,它覆蓋了我的高度和寬度。

/* For larger displays */ 
    @media (min-width: 1200px) { 
     .container { 
     width: 1170px 
     } 

我改變了這個寬度,它終於收聽了。

我有同樣的問題。不能說我真的找到了正確的解決方案,但我發現一個谷歌組織正在討論這個問題。 https://groups.google.com/forum/#!topic/slidesjs/mvbfqq0Fig4 我基本上試圖按照說明,並把它放在它周圍,並設置該div的高度和寬度。