0
我想將我的aspx頁面的lightbox插件合併到一個圖像中。我有一個主文件,並且在其中包含了lightbox和jquery javascript文件和css文件的引用。燈箱在aspx頁面
我有一個div元素,其中我有一個指定的文本,點擊文本我需要燈箱plugn顯示圖像。
請在下面找到aspx頁面的代碼。
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Home.aspx.cs" Inherits="Home" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<script type="text/javascript">
javascript: window.history.forward(1);
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<script type="text/javascript">
$(function() {
$('#frame a').lightBox();
});
</script>
<center>
<div class="wrapper row-offcanvas row-offcanvas-left">
\t <!-- Left side column. contains the logo and sidebar -->
\t <!-- Right side column. Contains the navbar and content of the page -->
\t <aside class="right-side">
\t <!-- Content Header (Page header) -->
\t <section class="content-header">
\t <h1>
\t </h1>
\t <ol class="breadcrumb">
\t \t <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
\t \t <li class="active">Student Details</li>
\t \t <li><a href="/AcuityBase/Home/Contact">Contact</a></li>
\t \t <br>
\t \t Last Updated on : 01 Jan 2015 Hrs CST </br>
\t </ol>
\t </section>
\t <div class="row">
\t \t <div class="col-xs-12 connectedSortable">
\t \t </div>
\t \t <!-- /.col -->
\t </div>
\t <br />
\t <!-- /.row -->
\t <!-- Main row -->
\t <div class="row">
\t \t <!-- Left col -->
\t \t <section class="col-lg-6 connectedSortable">
\t \t <!-- Box (with bar chart) -->
\t \t <div id="loading-example">
\t \t \t <div class="box-body no-padding">
\t \t \t \t <div class="row">
\t \t \t \t \t <div class="col-sm-7">
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t </section>
\t </div>
\t <section class="content">
\t <ul id="tabs">
\t </ul>
\t <div id="content">
\t \t <p>
\t \t \t <a class="frame" data-lightbox="example-set" href= "content/img/avatar3.png"> Load Tableau Report</a>
\t \t </p>
\t </div>
\t <div id="tab1">
\t \t <div id="tab2">
\t \t </div>
\t \t <div id="tab3">
\t \t </div>
\t </div>
\t <!-- top row -->
\t <!-- /.row -->
\t </section>
\t <!-- /.content -->
\t </aside>
</div>
</center>
</asp:Content>
我已經包含在主文件中的jQuery和燈箱插件的refences與燈箱CSS一起。代碼如下
<!-- LightBox -->
<script type="text/javascript" src="content/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="content/js/lightbox.js"></script>
<link href="content/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />
當我在文本中單擊,它的加載在同一窗口,而不是在一個燈箱式圖像。
任何人都可以幫助我嗎?