0

我不确定如何让 fancybox 在 Visual Studio 中运行。

我已经启动了 jquery,如果您单击锚点以触发弹出窗口,它会触发 fancybox,这一切都很好。

问题是我想要一个专用的 .aspx 页面来填充“fancybox”,如果这有意义的话。

我只是不确定如何将我想使用的页面链接或连接到花哨的盒子。

这是我的jQuery:

// Category Results Add Basket Pop Up

$("#list-category-results li .add-basket").fancybox({
    width: 620,
    height: 500,
    autoDimensions: false
});

这是我的 HTML:

 <ul id="list-category-results" class="clearfix">
    <li>
        <a href="#">
            <img src="images/categorylist_child_dummy.jpg" alt="categorylist_child_dummy" />
            <span class="result-info">
                <span class="result-type">Moquito Net</span>
                <span class="result-price">$12</span>
            </span>
        </a>
        <a href="#" class="add-basket">Add to gift basket</a>
    </li>
</ul>
4

1 回答 1

0

我认为您希望能够在不同的页面上一遍又一遍地重用fancybox。为此,您可能希望使用用户控件,而不是另一个 .aspx Web 表单。用户控件(除其他外)允许您在整个网站上一遍又一遍地使用相同的标记。

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %>

<ul id="list-category-results" class="clearfix">
        <li>
            <a href="#">
                <img src="<%= ImageURL %>" alt="<%= AltText %>" />
                <span class="result-info">
                    <span class="result-type"><%= Type %></span>
                    <span class="result-price"><%= Price %></span>
                </span>
            </a>
            <a href="#" class="add-basket">Add to gift basket</a>
        </li>
    </ul>

你背后的代码

 public partial class WebUserControl : System.Web.UI.UserControl
    {
        public string Type { get; set; }
        public string Price { get; set; }
        public string ImageURL { get; set; }
        public string AltText { get; set; }

        protected void Page_Load(object sender, EventArgs e)
        {
             // You can put code relevant to the fancybox images here
        }
    }

并且在每个 Web 表单 (.aspx) 上

<%@ Page Title="FancyBox Test Page .aspx" Language="C#" %>
<%@ Register Src="~/WebUserControl.ascx" TagPrefix="MyPrefix" TagName="Thing" %>

<!-- jquery and fancybox JS goes here -->

<MyPrefix:FancyBox Type="type goes here" Price="90" ImageURL="SRC to image" runat="server" AltText="This is the First Fancybox Control" />


<MyPrefix:FancyBox Type="type2 goes here" Price="90" ImageURL="SRC to image2" AltText="This is a Second Fancybox Control, you can reuse this tag!" runat="server" />
于 2012-08-16T23:49:26.383 回答