2015-06-08 168 views
0

此所述index.cshtml文件爲什麼這個html代碼給我一個錯誤?

@{ 
     ViewBag.Title = "Vishwaprani Healing Centre"; 
    } 

    <body> 
     <div id="wowslider-container1"> 
      <div class="ws_images"> 
       <ul> 
        <li><img src="@Url.Content("~/images/slider6.jpg")" alt="slider6" title="slider6" id="wows1_0" /></li> 
        <li><img src="@Url.Content("~/images/slider1.jpg")" alt="slider1" title="slider1" id="wows1_1" /></li> 
        <li><img src="@Url.Content("~/images/slider2.jpg")" alt="slider2" title="slider2" id="wows1_2" /></li> 
        <li><img src="@Url.Content("~/images/slider3.jpg")" alt="slider3" title="slider3" id="wows1_3" /></li> 
        <li><img src="@Url.Content("~/images/slider4.jpg")" alt="slider4" title="slider4" id="wows1_4" /></li> 
        <li><img src="@Url.Content("~/images/slider5.jpg")" alt="slider5" title="slider5" id="wows1_5" /></li> 
        <li><img src="@Url.Content("~/images/slider7.jpg")" alt="slider7" title="slider7" id="wows1_6" /></li> 
        <li><img src="@Url.Content("~/images/slider8.jpg")" alt="slider8" title="slider8" id="wows1_7" /></li> 
        <li><img src="@Url.Content("~/images/slider9.jpg")" alt="jquery photo gallery" title="slider9" id="wows1_8" /></li> 
        <li><img src="@Url.Content("~/images/slider10.jpg")" alt="slider10" title="slider10" id="wows1_9" /></li> 
       </ul> 
      </div> 
      <div class="ws_bullets"> 
       <div> 
        <a href="#" title="slider6"><span><img src="@Url.Content("~/images/thumb6.jpg")" alt="slider6" />1</span></a> 
        <a href="#" title="slider1"><span><img src="@Url.Content("~/images/thumb1.jpg")" alt="slider1" />2</span></a> 
        <a href="#" title="slider2"><span><img src="@Url.Content("~/images/thumb2.jpg")" alt="slider2" />3</span></a> 
        <a href="#" title="slider3"><span><img src="@Url.Content("~/images/thumb3.jpg")" alt="slider3" />4</span></a> 
        <a href="#" title="slider4"><span><img src="@Url.Content("~/images/thumb4.jpg")" alt="slider4" />5</span></a> 
        <a href="#" title="slider5"><span><img src="@Url.Content("~/images/thumb5.jpg")" alt="slider5" />6</span></a> 
        <a href="#" title="slider7"><span><img src="@Url.Content("~/images/thumb7.jpg")" alt="slider7" />7</span></a> 
        <a href="#" title="slider8"><span><img src="@Url.Content("~/images/thumb8.jpg")" alt="slider8" />8</span></a> 
        <a href="#" title="slider9"><span><img src="@Url.Content("~/images/thumb9.jpg")" alt="slider9" />9</span></a> 
        <a href="#" title="slider10"><span><img src="@Url.Content("~/images/thumb10.jpg")" alt="slider10" />10</span></a> 
       </div> 
      </div><div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.com">javascript slideshow</a> by WOWSlider.com v8.2</div> 
      <div class="ws_shadow"></div> 
     </div> 
     <script type="text/javascript" src="~/Scripts/script.js"></script> 
     <script type="text/javascript" src="~/Scripts/wowslider.js"></script>   
    </body> 

這是_Layout.cshtml代碼==>

https://docs.google.com/document/d/1qjQneUBALpjcxghWYEdKnBdnftmBybNA2W5lYqI7y9Q/edit

問題是,當我執行上述Index.cshtml其中包含的web滑塊與在Visual Studio 2013中給出_Layout.cshtml它給了我這樣一個錯誤==> enter image description here 這就是那個圖像中引起錯誤的函數==>

$("#wowslider-container1").wowSlider({ effect: "tv,glass_parallax,parallax,brick,collage,seven,kenburns,cube,blur,book,rotate,domino,slices,blast,blinds,basic,basic_linear,fade,fly,flip,page,stack,stack_vertical", prev: "", next: "", duration: 20 * 100, delay: 20 * 100, width: 1024, height: 768, autoPlay: true, autoPlayVideo: false, playPause: true, stopOnHover: false, loop: false, bullets: 1, caption: true, captionEffect: "parallax", controls: true, controlsThumb: false, responsive: 2, fullScreen: false, gestures: 2, onBeforeStep: 0, images: 0 }); 

這是.wowSlider方法應與上述代碼==>

https://docs.google.com/document/d/1ZsZp3XEiAKUdMaE5qbcA6idFW6vU66ivdT1wYLQZ_qY/edit

但是,當滑塊在正常的HTML被執行文件,將不會有問題執行。 ==>

enter image description here

是否有需要在代碼中的IIS Express服務器執行做任何修改?

+1

有你包括包含wowslider圖書館嗎?我的意思是,你確定它正在被加載? –

+0

我只包含了方法wowSlider。不是整個庫==> https://docs.google.com/document/d/1ZsZp3XEiAKUdMaE5qbcA6idFW6vU66ivdT1wYLQZ_qY/edit –

+0

這個wowslider.js ==> https://docs.google.com/document/d/1MZoSroTxaEtWS9nd7jcMn9f9xxZnIRsy5DU9Gh9OQHE/編輯 –

回答

1

所以,問題是通常的(腳本的順序)。

在問題中,wowslider的函數在DOM中定義之前被調用。

它需要在加載庫之後調用。

Problem-

<script type="text/javascript" src="~/Scripts/script.js"></script> //function called before the library loads. 
<script type="text/javascript" src="~/Scripts/wowslider.js"></script> //library loaded after 

解決方案 -

<script type="text/javascript" src="~/Scripts/wowslider.js"></script> //library is loaded first 
<script type="text/javascript" src="~/Scripts/script.js"></script> 
-2

這是一個包含正確腳本的問題。如果你這樣做,檢查路徑。

+0

正確嗎?你能拿出來嗎? – 3pic

+0

我包含正確的腳本。這是bundleconfig.cs代碼==> http://i.imgur.com/mxfleid.png,你可以看到style.css和jquery庫已經捆綁在一起。這是將這些包導入到layout.cs ==> http://i.imgur中的代碼的地方。com/KSGzU0b.png。這是導入其他兩個需要執行滑塊的庫。 ==> http://i.imgur.com/9II1q34.png –

+0

這是原始的HTML代碼。我錯過了什麼?==> https://docs.google.com/document/d/1qHu-iFYLM-yExwr9lX51SIhmU3T4RvLGCGl5r156VHc/edit。與我上面給出的細節匹配。 –

相關問題