首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何将超文本标记语言图像滑块添加到asp.net c#网站

问如何将超文本标记语言图像滑块添加到asp.net c#网站
EN

Stack Overflow用户
提问于 2014-03-15 09:10:23
回答 3查看 18.6K关注 0票数 1

我已经使用html和Jquery创建了一个图像滑块。我试图把这个图像滑块放到我的主页上的一个内容占位符,这是运行与c#的主页面模板。它不起作用。

图像滑块HTML:

代码语言:javascript
复制
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
     <title>jQuery Slider</title>

 <style type="text/css">
 .slider {
   width:1025px;
   height:500px;
   overflow:hidden;
   margin:30px auto;
 }
 .slider img{
   width:1025px;
   height:500px;
   display:none;
   margin:30px auto;
 }

  </style>
   <script type="text/javascript"
   src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
   <script type="text/javascript"
    src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-   ui.min.js"></script>
   <script type="text/javascript">

    function Slider() {
        $(".slider #1").fadeIn("fade, 500");
        $(".slider #1").delay(5500).hide("slide", { direction: 'left' }, 500);

        var sc = $(".slider img").size();
        var count = 2;

        setInterval(function (){
            $(".slider #" + count).show("slide",{direction:'right'}, 500);
            $(".slider #" + count).delay(5500).hide("slide", {direction:'left'}, 500);

            if(count == sc){
                count = 1;
            }else{
                count = count + 1;
              }
            }, 6500);
        }


  </script>
  </head>
  <body onload="Slider();">

  <div class="slider">
    <img id="1" src="Promotion1.png" border="0" alt="Promotion one" />
    <img id="2" src="Promotion2.png" border="0" alt="Promotion two" />
  </div>
  </body>
  </html>

我尝试将HTML放入的内容占位符:

代码语言:javascript
复制
<asp:Content ID="Content3" runat="server" contentplaceholderid="ContentPlaceHolder1">
</asp:Content>
EN

回答 3

Stack Overflow用户

发布于 2014-03-15 09:16:26

你必须有一个母版页,对吧,这就是为什么你使用内容页,对吗?您的母版页已经定义了head / body等HTML标记,因此只需将div放在内容占位符中

代码语言:javascript
复制
 <div class="slider" onload="Slider()";>
 <img id="1" src="Promotion1.png" border="0" alt="Promotion one" />
 <img id="2" src="Promotion2.png" border="0" alt="Promotion two" />
 </div>

在你的onload函数调用中,你需要把你的src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery- ui.min.js">标签移到母版页中,把你的jS放在一个JS文件中,并在你的母版页中引用它。理想情况下,你可以把你的JS代码放在内容页中,但这不是一个好的做法,它只是更容易创建一个js文件,并在你的masterpage...good中插入一个引用。

票数 1
EN

Stack Overflow用户

发布于 2016-07-14 08:10:09

首先,你的CDN是错误的。它应该是:

代码语言:javascript
复制
<script type="text/javascript"
 src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"> </script>
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

请注意,您遗漏了https部分。然后,单个页面的HTML应该可以自己工作。

然后使用适当的master和content标签遵循其他建议,或者回来询问更多问题:D

票数 1
EN

Stack Overflow用户

发布于 2015-06-03 10:38:06

在母版页中,将链接添加到jquery,然后为标题添加内容占位符。

使用最近创建的母版页添加新页。在该内容占位符中添加函数滑块。从正文中删除onload,并在页面中使用.load()并使用jquery添加调用。

在母版中添加第二个占位符,以便在正文中添加内容,并为滑块添加html。

希望能有所帮助。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/22418337

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档