Dans un projet récent, j'ai rencontré un problème pour obtenir cet effet :
Après avoir cliqué sur la vignette de la page pic_small.Aspx, la page pic_all.aspx apparaîtra. La taille de la page pic_all.aspx doit être automatiquement ajustée en fonction de la taille de l'image et elle doit contenir des informations de description pour l'image. Vous pouvez également cliquer sur l'image précédente et sur l'image suivante pour tourner la page.
Le processus de mise en œuvre est le suivant :
Le code sur la vignette de la page pic_small.Aspx est :
<IMG id="imgPic" style="CURSOR: hand" border=0 height="95" onclick="ShowWindow(<%#DataBinder.Eval(Container.DataItem,"ID")%>)" src='< %#"Images/Product/" + DataBinder.Eval(Container.DataItem,"PicUrl")%>' width="118" runat="server">
ShowWindow est enregistré dans le fichier OpenWindows.js avec le contenu suivant :
fonction ShowWindow (identifiant)
{
window.open('pic_all.aspx?ID=' + id,'_blank','Scrollbars=no');
}
Le code suivant peut réaliser qu'après avoir cliqué sur la vignette, la page pic_all.aspx apparaîtra pour afficher les informations sur l'image. Ce qui doit être implémenté ci-dessous, c'est que la page pic_all.aspx s'ajuste automatiquement en fonction de la taille de l'image.
Placez le code suivant entre <Head></Head> sur la page pic_all.aspx :
<script>
fonction window.onload()
{
var obj=document.getElementById("PicUrl");
window.resizeTo(obj.offsetWidth + 127,obj.offsetHeight + 75);
}
</script>
Le PicUrl ici est utilisé pour afficher la taille originale de l'image dans la page pic_all.aspx. J'utilise le contrôle html Quelle que soit la méthode que vous utilisez, vous devez lire le nom ou le chemin de l'image dans la base de données.
obj.offsetWidth obtient la largeur de l'image originale affichée. obj.offsetWidth + 127 signifie que la fenêtre est 127 pixels plus grande que la largeur de l'image, car il faut laisser de l'espace pour implémenter les informations de description de l'image.
De cette façon, la fenêtre pop-up peut être automatiquement ajustée en fonction de la taille de l'image, et la page pop-up peut être modifiée à volonté, car la page pop-up est une page désignée, et peu importe ce que vous voulez pour le modifier, vous pouvez le gérer de la même manière que d'habitude.
Merci à Bohu d'avoir fourni le code clé pour l'ensemble du processus de mise en œuvre, sans son aide, je ne serais pas en mesure de terminer le projet aujourd'hui et je ne pourrais pas quitter mon entreprise actuelle l'esprit tranquille, je voudrais l'exprimer. mes sincères remerciements à tous les amis qui sont enthousiastes à l'idée d'aider les autres, c'est pourquoi j'écrirai tous les problèmes rencontrés dans le projet, dans l'espoir d'aider davantage de personnes.