jquery - Flexslider 未显示在 IndexPage 上

标签 jquery html css asp.net twitter-bootstrap

我是 ASP.net 的新手。如果我的问题看起来很愚蠢,请原谅我。似乎我已经尝试了一切让 Flexslider 显示在我的索引页面上,但我似乎无法让它工作。 这是我的 _Layout 页面的代码

<!DOCTYPE html>
<html lang="en-us">
<head>

    <!-- mobile settings -->
    <meta name="viewport" content="width=device-width, maximum-scale=1, initial scale=1, user-scalable=0" />
    <!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
    <!-- WEB FONTS : use %7C instead of | (pipe) -->
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400%7CRaleway:300,400,500,600,700%7CLato:300,400,400italic,600,700" rel="stylesheet" type="text/css" />

    <!-- CORE CSS -->
    <link href="~/assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

    <!-- THEME CSS -->
    <link href="~/assets/css/essentials.css" rel="stylesheet" type="text/css" />
    <link href="~/assets/css/layout.css" rel="stylesheet" type="text/css" />

    <!-- PAGE LEVEL SCRIPTS -->
    <link href="~/assets/css/header-1.css" rel="stylesheet" type="text/css" />
    <link href="~/assets/css/color_scheme/green.css" rel="stylesheet" type="text/css" id="color_scheme" />
    <link href="~/Content/Site.css" rel="stylesheet" />
</head>
<body>

    @RenderBody();

    <!-- JAVASCRIPT FILES -->
    <script type="text/javascript"> var plugin_path = '~/assets/plugins/'</script>
    <script type="text/javascript" src="~/assets/plugins/jquery/jquery-2.2.3.min.js"></script>

    <script type="text/javascript" src="~/assets/js/scripts.js"></script>

    <!-- STYLESWITCHER - REMOVE -->
    @*<script async type="text/javascript" src="~/assets/plugins/styleswitcher/styleswitcher.js"></script>*@

    @RenderSection("scripts", required: false)
</body>
</html>

现在这是我定义了 flexslider 的索引页面的代码。

<body>
            <div class="flexslider">
                <ul class="slides">
                    <!-- Slide 1 -->
                    <li>
                        <a href="#">
                            <img src="~/assets/images/demo/content_slider/10-min.jpg" alt="Slide 2">
                            <div class="flex-caption">My text 1</div>
                        </a>
                    </li>

                    <!-- Slide 2 -->
                    <li>
                        <a href="#">
                            <img src="~/assets/images/demo/content_slider/3-min.jpg" alt="Slide 3">
                            <div class="flex-caption">My text 2</div>
                        </a>
                    </li>

                    <!-- Slide 3 -->
                    <li>
                        <a href="#">
                            <img src="~/assets/images/demo/content_slider/21-min.jpg" alt="Slide 4">
                            <div class="flex-caption">My text 3</div>
                        </a>
                    </li>

                    <!-- Slide 4 -->
                    <li>
                        <a href="#">
                            <img src="~/assets/images/demo/content_slider/23-min.jpg" alt="Slide 5">
                            <div class="flex-caption"My text 4</div>
                        </a>
                    </li>
                </ul>
            </div>
</body>

有人可以帮我解决这个问题吗?我正在使用 smarty bootstrap 模板。所有 css 类的路径都是有效的,所有的 js 脚本都是有效的。

我尝试了无数的选择来使这项工作成功,但到目前为止我运气不好。

最佳答案

我没有意识到我在这一行中有 tilda (~) var plugin_path = '~/assets/plugins/'

因为 ~ js 脚本没有加载。我删除了 ~,flexslider 现在出现了。

关于jquery - Flexslider 未显示在 IndexPage 上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42653030/

相关文章:

javascript - 将 javascript 变量的动态值解释为文本框 ID

javascript - Firefox 上的正则表达式问题

html - YouTube iframe用户列表自动播放

jquery - 不同选项卡上的箭头指示器 CSS

javascript - 检查页面重新加载时是否选择了某个选项

jquery - 如何使用 jQuery 切换 CSS?

html - 表格宽度占页面的 100%,我需要表格与其他元素在同一行

javascript - jQuery .html() 用 html/javascript 代码填充一个 div

css - 手机间隙 : InAppBrowser insertCSS file

html - 屏幕分辨率改变时改变列