Parcourir un ensemble d'images avec un bouton
Bonjour, j'ai un repeater dans ma page asp :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
| <div>
<asp:Repeater runat="server" ID="repeatPhotos">
<ItemTemplate>
<span style="float: left; width: 130px;">
<asp:ImageButton ImageUrl='<%# Eval("Chemin") %>' ID="imgPhoto" runat="server" alt=""
Style="width: 100px; height: 100px; cursor: pointer" OnClientClick="return LoadDiv(this.src);" /></span>
</ItemTemplate>
</asp:Repeater>
<div id="divBackground" class="modal"></div>
<div id="divImage">
<table style="height: 100%; width: 100%">
<tr>
<td valign="middle" align="center">
<img id="imgLoader" alt="" src="images/loader.gif" />
<img id="imgFull" alt="" src="" style="display: none; height: 500px; width: 590px" />
</td>
</tr>
<tr>
<td align="center" valign="bottom">
<input id="btnClose" type="button" value="Fermer" onclick="HideDiv()" class="button" />
</td>
</tr>
</table>
</div>
</div> |
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
| function LoadDiv(url) {
var img = new Image();
var bcgDiv = document.getElementById("divBackground");
var imgDiv = document.getElementById("divImage");
var imgFull = document.getElementById("imgFull");
var imgLoader = document.getElementById("imgLoader");
imgLoader.style.display = "block";
img.onload = function () {
imgFull.src = img.src;
imgFull.style.display = "block";
imgLoader.style.display = "none";
};
img.src = url;
var width = document.body.clientWidth;
if (document.body.clientHeight > document.body.scrollHeight) {
bcgDiv.style.height = document.body.clientHeight + "px";
}
else {
bcgDiv.style.height = document.body.scrollHeight + "px";
}
imgDiv.style.left = (width - 650) / 2 + "px";
imgDiv.style.top = "20px";
bcgDiv.style.width = "100%";
bcgDiv.style.display = "block";
imgDiv.style.display = "block";
return false;
}
function HideDiv() {
var bcgDiv = document.getElementById("divBackground");
var imgDiv = document.getElementById("divImage");
var imgFull = document.getElementById("imgFull");
if (bcgDiv != null) {
bcgDiv.style.display = "none";
imgDiv.style.display = "none";
imgFull.style.display = "none";
}
} |
j'ai reussi a agrandir chaque image avec un bouton close, mais ce que je souhaite faire c'est d'avoir un bouton suivant precedent pour parcourir toutes les images,
comment puis je faire /