Question

我正在使用动态更改内容的JqueryDynamicContent.js，但是在调用包含flexslider的页面时却没有。它根本就没有出现。如果我将直接flexslider放在索引页面上，它就能正常工作。什么可以？谢谢。

的index.php

<!DOCTYPE html>
<html>
<head>
    <title>EPINOX</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <meta name="keywords" content="Ino, Corrimão, Guarda-Corpo, Suporte de Mangueira, Churrasqueira">
    <meta name="description" content="Confecções de peças sob medida em Aço Inox.">
    <link rel="SHORTCUT ICON" href="ico/favicon.ico" />
    <script src="http://code.jquery.com/jquery.js"></script>
    <!-- Le fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png">
    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-theme.css" rel="stylesheet">
    <link href="css/bootstrapValidator.css" rel="stylesheet">
    <link href="css/bootstrap-steps.css" rel="stylesheet">
    <link href="css/flexslider.css" rel="stylesheet">
    <link href="css/responsivemobilemenu.css" rel="stylesheet">
    <link href="css/footer-distributed-with-address-and-phones.css" rel="stylesheet">
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/magnific-popup.css">
     <!--<link href="css/site.css" rel="stylesheet">-->
      <link href="css/site2.css" rel="stylesheet">

    <script src="js/jQuery-1.11.1.js"></script>
    <script src="js/bootstrapValidator.js"></script>
    <script src="js/jQueryDynamicContent.js"></script>

    <script src="js/accordion.js"></script>
    <script src="js/responsivemobilemenu.js"></script>
</head>
<?php include("top.php"); ?>
  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-twttr-rendered="true">

    <?php include("menu2.php"); ?>


    <div id="div_content" class="div_content">

    </div>

    <?php include("footer.php"); ?>

    <script src="js/bootstrap.min.js"></script>
    <script src="http://code.jquery.com/jquery.js"></script>
    <script src="js/jquery.flexslider.js"></script>
    <script>
        $(document).ready(function() {
            $('#flexslider').flexslider({
              animation: "slide"
            });

            // The slider being synced must be initialized first
            $('#carousel').flexslider({
              animation: "slide",
              controlNav: false,
              animationLoop: false,
              slideshow: false,
              itemWidth: 210,
              itemMargin: 5,
              asNavFor: '#slider'
            });


            $('#slider').flexslider({
              animation: "slide",
              controlNav: false,
              animationLoop: false,
              slideshow: false,
              sync: "#carousel"
            });

        });
    </script>

</body>
</html>

JqueryDynamicContent.js

$(document).ready(function() {
var content = $('#div_content');

//pre carregando o gif
loading = new Image();
loading.src = '../images/ajax-loader.gif';

$('#rmm a').click(function(e) {
    var arq = pega_arq($(this).attr('href'));
    abre(arq, content);
});

/* iniciando com a home */
abre(pega_arq(document.location.href), content);
});
function abre(href, content) {
content.html('<img id="loader" src="../images/ajax-loader.gif" />');

$.ajax({
    url: href,
    success: function(response) {
        content.delay(250).hide().html(response).fadeIn();
    }
});
}
function pega_arq(url) {
var file = url.split('#');
return (file[1]) ? file[1] + '.php' : 'Home.php';
}

Ralos.php

<div id="slider" class="flexslider">
<ul class="slides">
<li>
        <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_lemon.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_donut.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_caramel.jpg" />
            </li>
<li>
        <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_lemon.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_donut.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_caramel.jpg" />
            </li>
<li>
        <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_lemon.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_donut.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_caramel.jpg" />
            </li>
   </ul>
   </div>
   <div id="carousel" class="flexslider">
   <ul class="slides">
   <li>
        <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_lemon.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_donut.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_caramel.jpg" />
            </li>
<li>
        <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_lemon.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_donut.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_caramel.jpg" />
            </li>
    <li>
        <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_lemon.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_donut.jpg" />
            </li>
            <li>
        <img src="images/kitchen_adventurer_caramel.jpg" />
            </li>
  </ul>
  </div>

menu2.php

<div id="rmm" class="rmm" data-menu-style='sapphire' style="padding-top: 15px; padding-bottom: 15px">
    <ul>
        <li><a href='#Home' class="btn_menu">Home</a></li>
        <li><a href="#Ralos" class="btn_menu">Ralos</a></li>
        <li><a href='#menu' class="btn_menu">Menu</a></li>
        <li><a href='#menu' class="btn_menu">Menu</a></li>
        <li><a href='#menu' class="btn_menu">Menu</a></li>
        <li><a href='#menu' class="btn_menu">Menu</a></li> 
   </ul>

动态内容使flexslider无效

0 个答案: