添加一个弹出到这个默认.aspx页面

c6ubokkw  于 2023-03-13  发布在  .NET
关注(0)|答案(2)|浏览(98)

我有一个小网站，我想添加一个弹出窗口（一个链接和关闭按钮的图像），但我找不到它的好代码有人能帮助吗？我尝试了几个在互联网上，但没有锁。对不起后，但我从来没有在aspx工作，所以它对我来说都是新的。

<%@ page language="VB" autoeventwireup="false" inherits="_Default, ctts_2016" %>
<!DOCTYPE html>
<html lang="<%= CurrentPageData.LanguageCode %>">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title id="meta_Title" runat="server">CTTS - Trucks and trailers</title>
        <meta name="keywords" content="" id="meta_Keywords" runat="server" />
        <meta name="description" content="" id="meta_Description" runat="server" />
        <meta http-equiv="content-language" content="<%= CurrentPageData.LanguageCode %>" />
        
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width" />

        <%--indexing--%>
        <%= formatAllowIndexing()%>
        <%--Css--%>
        <%= Functions.InsertCSS("css/bootstrap", False)%>
        <%= Functions.InsertCSS("css/font-awesome", False)%>
        <%= Functions.InsertCSS("css/animate", False)%>
        <%= Functions.InsertCSS("css/settings", False)%>
        <%= Functions.InsertCSS("css/owl.carousel", False)%>
        <%= Functions.InsertCSS("css/owl.theme", False)%>
        <%= Functions.InsertCSS("css/magnific-popup", False)%>
        <%= Functions.InsertCSS("css/select2", False)%>
        <%= Functions.InsertCSS("css/preset", False)%>
        <%= Functions.InsertCSS("css/style", False)%>
        <%= Functions.InsertCSS("css/responsive", False)%>
        <%= Functions.InsertCSS("css/wide", False)%>
        <%--<%= Functions.InsertCSS("css/color", False)%>--%>
        <%= Functions.InsertCSS("css/ttc", False)%>

        <!--[if lt IE 9]>
            <%= Functions.InsertJS("js/responsive/html5shiv", False)%>
            <%= Functions.InsertJS("js/responsive/respond", False)%>
        <![endif]--> 

        <%--Javascript--%>
        <%= Functions.FormatSiteUrl()%> <%--deze regel NIET verwijderen (zorgt ervoor dat javascript functies de siteurl instelling uit de webconfig kunnen gebruiken)--%>

        <%--google--%>        
        <%= Functions_Site.formatGoogleWebmasterTools()%> <%--deze regel voegt de nodige code toe om een site te "koppelen" aan een Google Webmaster Tools account--%>
        <%= Functions_Site.formatGoogleAnalitics()%> <%--deze regel voegt de nodige code toe om een site te "koppelen" aan een Google Analytics account--%>

        <link rel="canonical" href="<%= CurrentPageData.GetPageLink() %>"/>

        <%--favicon--%>
        <link type="image/x-icon" href="<%= Functions.SiteUrl %>images/favicon.ico" rel="icon"/>
        <link type="image/x-icon" href="<%= Functions.SiteUrl %>images/favicon.ico" rel="shortcut icon"/>
    </head>
    <body>
        <form id="frmXenia" runat="server"> <%--deze form NIET verwijderen, is verplicht bij asp.net pagina's--%>
            <%--<div class="preloader">
                <img src="<%= Functions.SiteUrl %>images/preloader.gif" alt="LOADING..." />
            </div>--%>

            <!--wrapper-->
            <div class="box">
                <!--header top bar-->
                <section class="headerTopbar">
                    <div class="container">
                        <div class="row">
                            <div class="col-sm-6 col-xs-12">
                                <%--<p class="headTOpinfo">
                                    C.T.T.S - Cars, Trucks & Trailers Service
                                </p>--%>
                            </div>

                            <div class="col-sm-6 col-xs-12 text-right resMobcenter">
                                <asp:Literal ID="ltlLanguages" runat="server" />
                            </div>
                        </div>
                    </div>                    
                </section>
                
                <!--header middle-->                
                <section class="headerMiddle">
                    <div class="container">
                        <div class="row">
                            <div class="col-sm-3 col-xs-12">
                                <div class="logo">
                                    <a href="<%= Functions.SiteUrl %>">
                                        <img src="<%= Functions.SiteUrl %>images/logo.png" alt="C.T.T.S - Trucks and Trailers" />
                                    </a>
                                </div> 
                            </div>
                            <div class="col-sm-9 col-xs-12 text-right">
                               <div class="singlehmib">
                                    <i class="fa fa-mobile-phone"></i>
                                    <h2>Tel</h2>
                                    <h4>+32 (0) 56 61 01 61</h4>
                                </div>
                                <div class="singlehmib">
                                    <i class="fa fa-envelope-o"></i>
                                    <h2>Email </h2>
                                    <h4>info@ctts.be</h4>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                
                <!--header-->
                <header class="header">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-9 col-sm-12">
                                <nav class="mainnav">
                                    <div class="logoMobile hidden-lg hidden-sm hidden-md"></div>
                                    <div class="mobileMenu hidden-lg hidden-sm hidden-md">
                                        <span></span>
                                        <span></span>
                                        <span></span>
                                    </div>
                                    <asp:Literal ID="ltlMenu" runat="server" />
                                </nav>
                            </div>
                            <div class="col-lg-3 col-sm-12 hidden-xs"> <%--verbergen op mobiel--%>
                                <%--<div class="searchHeader"> 
                                    <a href="#" class="headerSeacBtn"><i class="fa fa-search"></i></a>
                                    <div class="searchMe">
                                        <input type="search" placeholder="Search...">
                                        <button type="submit"><i class="fa fa-search"></i></button>
                                        <a href="#" class="cluseSearch"><i class="fa fa-close"></i></a>
                                    </div>
                                </div>--%>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </header>
                
                <!--content-->
                <asp:PlaceHolder ID="phContent" runat="server" />

                <%--footer--%>
                <footer class="footer">
                    <div class="container">
                        <div class="row">
                            <asp:Literal ID="ltlFooter" runat="server" />
                        </div>
                    </div>
                </footer>

                <!--copyright-->
                <section class="copyright">
                    <div class="container">
                        <div class="row">
                            <div class="col-sm-6 col-xs-12">
                                C.T.T.S - Cars, Trucks & Trailers Service
                            </div>
                            <div class="col-sm-6 col-xs-12 text-right">
                            </div>
                        </div>
                    </div>
                </section>
            </div>
            
            <a href="#" id="backToTop" class="hideit"><i class="fa fa-angle-up"></i></a>
</div>
            <%--javascript--%>
            <%= Functions.InsertJS("js/jquery", False)%>
            <%= Functions.InsertJS("js/bootstrap", False)%>
            <%= Functions.InsertJS("js/jquery.themepunch.revolution", False)%>
            <%= Functions.InsertJS("js/jquery.themepunch.tools", False)%>
            <%= Functions.InsertJS("js/owl.carousel", False)%>
            <%= Functions.InsertJS("js/jquery.magnific-popup", False)%>
            <%= Functions.InsertJS("js/mixer", False)%>
            <%= Functions.InsertJS("js/select2.full", False)%>
            <%= Functions.InsertJS("js/theme", False)%>
            <%= Functions.InsertJS("js/stickyfooter", True)%>
            <div id="divRenderTime" runat="server" style="margin: 0px auto;">
                page rendered in: <asp:literal ID="ltlExecutionTime" runat="server" />ml>
            </div>
        </form>
    </body>
</html>

有人可以帮助弹出代码

asp.net

2条答案

按热度按时间
bzzcjhmw

bzzcjhmw1#

我建议使用jquery.ui。
您很有可能已经安装了jQuery，并且可能正在使用它。
既然几乎每个人都有jquery，那么就添加jQuery.ui。
我确实“喜欢”引导对话框的外观+感觉，但使用它们比去看牙医更糟糕。
更棒的是，您可以将这样的jQury.ui对话框用于现有的asp.net按钮。
所以，这样说：

所以，方法是这样的：

<asp:Button ID="cmdTestDialog" runat="server" 
            Text="Show dialog"
            CssClass="btn"
            
            OnClientClick="MyDialog();return false"
            
         />

        <div id="MyCoolDialog" style="display:none">
            <div style="text-align:right">
                <h5>Enter First Name&nbsp;&nbsp; <asp:TextBox ID="txtFirst" runat="server"></asp:TextBox>
                </h5>
                <h5>Enter Last Name&nbsp;&nbsp;
                    <asp:TextBox ID="txtLast" runat="server"></asp:TextBox>
                </h5>
            </div>

        </div>

        <script>

            function MyDialog(btn) {

                var myDialog = $("#MyCoolDialog");
                myDialog.dialog({
                    title: "Enter Name",
                    modal: true,
                    width: "400px",
                    position: { my: "right top", at: "right bottom",of: btn },
                    buttons: {
                        ok: function () {
                            myDialog.dialog("close")
                        }
                    }
                })
            }

        </script>

因此，我们有一个简单的普通janeasp.net按钮。
我们弹出的“什么”将被放置在一个div中。你在那个div中放置的内容是相当多的。
因此，以上结果如下：

所以，只要创建一个简单的“div”，里面有你想要的任何东西（比如你链接）。
然后将jQuery.ui添加到项目中。
因此你现在可以弹出任何内容。
我弹出的对话框右下角的按钮点击。
但是，如果您删除位置代码，则对话框将显示页面中心。
因此，删除以下内容：

position: { my: "left top", at: "right bottom",of: btn },

对话框将在页面中居中。
所以，设置，获取，获取，享受一个好的对话框系统。一旦你让“一个”工作，那么当然你就有了一个很好的设置和系统来用于应用程序中的任何对话框。
虽然有很多“选择”要使用什么系统，但jQuery.ui对话框似乎是最好的选择。
我不太喜欢默认的80年代风格的标题栏布局（看起来有点像windows3.1），但是，经过一些努力，你可以把对话框设计得和任何引导对话框一样好。
我觉得jQuery.ui对话框是更好的选择。

They have great position options - bootstrap ones don't
 They allow  you even load content from another page - bootstrap ones don't

 They just work, and work on a simple click event (not some insane
 asylum approach with a boatload of class(s) that you apply to a
 div, and THEN hope on a wing and prayer they pop when you want
 them to.

 They are draggable like desktop software.
 They can be "model" and nicely grey out/disable the background
 I can type on for 100+ more pages, but until bootstrap dialogs
 gain a normal type click and show, and normal approach to
 development, then jQuery.ui dialogs wins hands down as better choice.

而且jQuery.ui与弹出窗口拦截器配合得很好。

赞(0）分享  回复(0）举报  2023-03-13
4bbkushb

4bbkushb2#

奇怪的事实是，poptin工作得很好，所以在某个地方我错过了一些东西。

赞(0）分享  回复(0）举报  2023-03-13
我来回答

相关问题

    查看更多

    热门标签

    更多
    JavaquerypythonNode开发语言requestUtil数据库Table后端算法LoggerMessageElementParser

    最新问答

    更多
    • 蜀ICP备13028337号-1 大数据知识库 https://www.saoniuhuo.com © All rights reserved
    • 本站内容来源互联网,如果侵犯您的权益请联系我们删除, 联系方式：448109455@qq.com