複製的引導程序不起作用

-1

我有這個已複製的頁面引導程序，但是當我嘗試複製相同的節頁面時，複製的節頁面不執行類。複製的引導程序不起作用

我在做什麼錯？

這裏是工作代碼：

<section id="work" class="page-section page"> 


    <div class="container"> 
     <div class="heading text-center"> 
      <h2>Experimental Learning</h2> 
      <p></p> 
     </div> 
     <div class="row"> 
      <div class="col-md-12"> 
      <div id="portfolio"> 
       <ul class="filters list-inline text-center"> 
       <li> <a class="active" data-filter="*" href="#">All</a> </li> 
       <li> <a data-filter=".academic" href="#">Academic</a> </li> 
       <li> <a data-filter=".sales" href="#">Sales & Freelance</a> </li> 
       <li> <a data-filter=".bpo" href="#">BPO</a> </li> 
       </ul> 
       <ul class="items list-unstyled clearfix animated fadeInRight showing" data-animation="fadeInRight" style="position: relative; height: 438px;"> 
       <li class="item academic" style="position: absolute; left: 0px; top: 0px;"> <a href="images/work/sol.jpg" class="fancybox"> <img src="images/work/sol.jpg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Solaire Hotel & Resort Casino</span> </div> 
        </a> </li> 
       <li class="item bpo" style="position: absolute; left: 292px; top: 0px;"> <a href="images/work/tele.jpeg" class="fancybox"> <img src="images/work/tele.jpeg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Teleperformance</span> </div> 
        </a> </li> 
       <li class="item academic" style="position: absolute; left: 585px; top: 0px;"> <a href="images/work/sc.jpg" class="fancybox"> <img src="images/work/sc.jpg" 
    style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Pierre Romancon Scholarship Grant</span> </div> 
        </a> </li> 
       <li class="item sales" style="position: absolute; left: 877px; top: 0px;"> <a href="images/work/av.jpg" class="fancybox"> <img src="images/work/av.jpg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Avida Corporation</span> </div> 
        </a> </li> 
       <li class="item bpo" style="position: absolute; left: 0px; top: 219px;"> <a href="images/work/tt.jpg" class="fancybox"> <img src="images/work/tt.jpg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Teletech</span> </div> 
        </a> </li> 
       <li class="item sales" style="position: absolute; left: 292px; top: 219px;"> <a href="images/work/fl.jpg" class="fancybox"> <img src="images/work/fl.jpg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Freelance RealEstate</span> </div> 
        </a> </li> 
       <li class="item bpo" style="position: absolute; left: 585px; top: 219px;"> <a href="images/work/x.jpg" class="fancybox"> <img src="images/work/x.jpg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Affiliated Computer Services</span> </div> 
        </a> </li> 
       <li class="item academic" style="position: absolute; left: 877px; top: 219px;"> <a href="images/work/startup.jpg" class="fancybox"> <img src="images/work/startup.jpg" style="width:304px;height:228px;" alt=""> 
        <div class="overlay"> <span>Benildean Startup Youth Day 2014</span> </div> 
        </a> </li> 
       </ul> 
      </div> 
      </div> 
     </div> 
     </div> 
    </section>

當我複製相同的部分頁面，它不是在類執行相同功能。

<section id="work1" class="page-section page"> 
    <div class="container"> 
    <div class="heading text-center"> 
     <h2>Exemplary Academic Work</h2> 
     <p></p> 
    </div> 
    <div class="row"> 
     <div class="col-md-12"> 
     <div id="portfolio1"> 
      <ul class="filters list-inline text-center"> 
      <li> <a class="active" data-filter="*" href="#">All</a> </li> 
      <li> <a data-filter=".proglanproject" href="#">Programming Language</a> </li> 
      <li> <a data-filter=".thesis" href="#">Thesis</a> </li> 
      </ul> 
      <ul class="items list-unstyled clearfix animated fadeInRight showing" data-animation="fadeInRight" style="position: relative; height: 438px;"> 
      <li class="item proglanproject" style="position: absolute; left: 0px; top: 0px;"> <a href="images/work/Picture1.png" class="fancybox"> <img src="images/work/Picture1.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>LUA Steam Project Site Map</span> </div> 
       </a> </li> 
      <li class="item proglanproject" style="position: absolute; left: 292px; top: 0px;"> <a href="images/work/Picture2.png" class="fancybox"> <img src="images/work/Picture2.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>LUA Steam Project Site Map</span> </div> 
       </a> </li> 
      <li class="item thesis" style="position: absolute; left: 585px; top: 0px;"> <a href="images/work/th5.png" class="fancybox"> <img src="images/work/th5.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>Registration Page</span> </div> 
       </a> </li> 
      <li class="item thesis" style="position: absolute; left: 877px; top: 0px;"> <a href="images/work/th4.png" class="fancybox"> <img src="images/work/th4.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>Contact Form</span> </div> 
       </a> </li> 
      <li class="item thesis" style="position: absolute; left: 0px; top: 219px;"> <a href="images/work/th3.png" class="fancybox"> <img src="images/work/th3.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>Customer Profile Page</span> </div> 
       </a> </li> 
      <li class="item thesis" style="position: absolute; left: 292px; top: 219px;"> <a href="images/work/th2.png" class="fancybox"> <img src="images/work/th2.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>Checkout DashBoard</span> </div> 
       </a> </li> 
      <li class="item thesis" style="position: absolute; left: 585px; top: 219px;"> <a href="images/work/th1.png" class="fancybox"> <img src="images/work/th1.png" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>Product Dashboard</span> </div> 
       </a> </li> 
      <li class="item proglanproject" style="position: absolute; left: 877px; top: 219px;"> <a href="images/work/prog.PNG" class="fancybox"> <img src="images/work/prog.PNG" style="width:304px;height:228px;" alt=""> 
       <div class="overlay"> <span>HTML Shopping Site</span> </div> 
       </a> </li> 
      </ul> 
     </div> 
     </div> 
    </div> 
    </div> 
</section>

來源

2015-08-09 Paolo Duhaylungsod

這是什麼意思，不工作？有沒有連接到一些JavaScript代碼，也許你沒有複製？ –

你的意思是當你將它複製到一個新的.html文件？如果是這樣，它幾乎肯定不起作用，因爲你沒有將CSS文件包含在新頁面頭標記 – hammus

相同的html文件先生@leemo –

我明白了。在同一頁面上進行復制會造成問題，因爲div的ID相同，它們會有所不同。

<section id="work2"...

同爲

<div id="portfolio1"

等...

來源

2015-08-09 12:35:30

是的，先生。它的不同，正如你可以在第一個代碼中看到的那樣，部分id =「work」，第二個代碼的部分id =「work1」。 div ID也不同。組合和投資組合1。 –

您還需要更新JavaScript文件告訴它該怎麼做。比如我有一個自舉一個頁面模板還其資產/ JS/[THEMENAME] .js文件與參考文件：

var filterList = { 
    init: function() { 

     // MixItUp plugin 
     // http://mixitup.io 
     $('#portfoliolist').mixitup({ 
      targetSelector: '.portfolio', 
      filterSelector: '.filter', 
      effects: ['fade'], 
      easing: 'snap', 
      // call the hover effect 
      onMixEnd: filterList.hoverEffect() 
     }); 
    },

正如你可以看到它使用目標選擇.portfolio標識類，它需要申請。我相信你需要複製該部分，以便也適用於.portfolio1爲了它的工作。

您已經使過濾器引用匹配，所以其他一切都應該沒問題。哦，但取決於你在做什麼，你可能還需要更改ID #portfoliolist。

來源

2015-08-09 13:09:11 Lyall

複製的引導程序不起作用

回答

相關問題