本文介绍了大图片点击打开新灯箱?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我的脚本
My Script when i click big image
<script>
$(function () {
$('.pop').on('click', function () {
$('.imagepreview').attr('src', $(this).find('img').attr('src'));
$('#imagemodal').modal('show');
});
});
</script>
我的普通滑块
my Normal Slider
<script type="text/javascript">
$(document).ready(function () {
$('#photos').galleryView({
frame_width: 100,
frame_height: 100,
nav_theme: 'custom'
});
});
</script>
<div class="row">
<div class="col-md-6 col-sm-7">
<div id="photos" class="galleryview">
<asp:Repeater ID="Repeater2" runat="server">
<itemtemplate>
<div class="panel">
<div style="padding: 10px 10px 10px 10px; border-removed 1px solid #CCCCCC">
<a href="#" class="pop">
<asp:Image ID="Image1" runat="server" alt='<%#Eval("carimgpath") %>' ImageUrl='<%#Eval("carimgpath") %>' Width="100%" Height="250" class="img-responsive" Style="border: 2px solid black" />
</a>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</div>
</itemtemplate>
<ul class="filmstrip">
<asp:Repeater ID="Repeater1" runat="server">
<itemtemplate>
<li>
<asp:Image ID="Image1" Width="100" Height="100" alt='<%#Eval("carimgpath") %>' ImageUrl='<%#Eval("carimgpath") %>' runat="server" />
</li>
</itemtemplate>
</ul>
</div>
</div>
<div class="visible-xs">
<br />
</div>
<div class="col-md-6 col-sm-5">
<div class="row">
<div class="col-md-12">
<span style="font-weight: bold; color: #f60; font-size: 16px">KD</span>
<asp:Label ID="lblPrice" runat="server" Text="Price" Style="font-weight: bold; color: #f60; font-size: 16px"><br />
<br />
<i class="fa fa-chevron-right" style="padding-removed 7px; color: #f60"></i>
<asp:Label ID="lblCartype" runat="server" Text="Cartype" Style="font-weight: bold">
<asp:Label ID="lblVechiletype" runat="server" Text="Vechile" Style="font-weight: bold">
</div>
</div>
<br />
<div class="row" style="margin-removed 10px;border:1px solid #B2B2B2;padding-removed10px;padding-removed10px;margin:0;min-height:315px">
<div class="col-md-12">
<div class="col-md-6 col-sm-6">
<p style="padding-removed 10px; border-removed 1px solid #B2B2B2; font-weight: bold;font-size:12px">Technical Data</p>
<span class="labels">Mileage:</span>
<asp:Label ID="lblMileage" runat="server" Text="Mileage" Style="font-weight: bold; font-size: 12px">
  <span class="labels">KMPL</span><br />
<br />
<span class="labels">Registration Date:</span>
<asp:Label ID="lblRegdate" runat="server" Text="Date" Style="font-weight: bold; font-size: 12px"><br />
<br />
<span class="labels">GearBox:</span>
<asp:Label ID="lblGearbox" runat="server" Text="Gerbox" Style="font-weight: bold; font-size: 12px"><br />
<br />
<span class="labels">Roadworthy: </span>
<asp:Label ID="lblRoadworthy" runat="server" Text="No" Style="font-weight: bold; font-size: 12px"><br />
<br />
<span class="labels">Country: </span>
<asp:Label ID="lblCountry" runat="server" Text="Country" Style="font-weight: bold; font-size: 12px"><br />
</div>
<div class="col-md-6 col-sm-6">
<p style="padding-removed 10px; border-removed 1px solid #B2B2B2; font-weight: bold;font-size:12px">Features</p>
<span class="labels">Climatecontrol:</span>
<asp:Label ID="lblClimatecontrol" runat="server" Text="No" Style="font-weight: bold; font-size: 12px"><br />
<br />
<span class="labels">Parking Sensors:</span>
<asp:Label ID="lblParkingsensors" runat="server" Text="Parking Sensors" Style="font-weight: bold; font-size: 12px"><br />
<br />
<span class="labels">Interior Design:</span>
<asp:Label ID="lblInteriorDesign" runat="server" Text="Interior Design" Style="font-weight: bold; font-size: 12px"><br />
<br />
<span class="labels">Interiour Color: </span>
<asp:Label ID="lblInteriourColor" runat="server" Text="Interiour Color" Style="font-weight: bold; font-size: 12px"><br />
<asp:DataList ID="dlFeature" runat="server">
<itemtemplate>
<div style="padding-removed10px">
<asp:Label ID="Label1" runat="server" Text='<%# Eval("Features") %>' Style="font-weight: bold; font-size: 12px">
</div>
</itemtemplate>
</div>
</div>
</div>
</div>
</div>
推荐答案
这篇关于大图片点击打开新灯箱?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!