In einem kürzlich durchgeführten Projekt bin ich auf ein Problem gestoßen, um diesen Effekt zu erzielen:
Nachdem Sie auf die Miniaturansicht der Seite pic_small.Aspx geklickt haben, wird die Seite pic_all.aspx angezeigt. Die Größe der Seite pic_all.aspx sollte automatisch an die Größe des Bildes angepasst werden und sie muss Beschreibungsinformationen für das Bild enthalten. Sie können auch auf das vorherige Bild und das nächste Bild klicken, um umzublättern.
Der Implementierungsprozess ist wie folgt:
Der Code im Miniaturbild der Seite pic_small.Aspx lautet:
<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 wird in der Datei OpenWindows.js mit folgendem Inhalt gespeichert:
Funktion ShowWindow( id)
{
window.open('pic_all.aspx?ID=' + id,'_blank','Scrollbars=no');
}
Der folgende Code kann erkennen, dass nach dem Klicken auf die Miniaturansicht die Seite pic_all.aspx angezeigt wird, um die Bildinformationen anzuzeigen. Nachfolgend wird implementiert, dass sich die Seite pic_all.aspx automatisch an die Größe des Bildes anpasst.
Platzieren Sie den folgenden Code zwischen <Head></Head> auf der Seite pic_all.aspx:
<script>
Funktion window.onload()
{
var obj=document.getElementById("PicUrl");
window.resizeTo(obj.offsetWidth + 127,obj.offsetHeight + 75);
}
</script>
Die PicUrl wird hier verwendet, um die Originalbildgröße auf der Seite pic_all.aspx anzuzeigen. Egal welche Methode Sie verwenden, Sie müssen den Namen oder Pfad des Bildes aus der Datenbank lesen.
obj.offsetWidth ruft die Breite des angezeigten Originalbilds ab. obj.offsetWidth + 127 bedeutet, dass das Fenster 127 Pixel größer ist als die Breite des Bilds, da etwas Platz übrig bleiben muss, um die Beschreibungsinformationen des Bilds zu implementieren.
Auf diese Weise kann das Popup-Fenster automatisch an die Größe des Bildes angepasst werden und die Popup-Seite kann nach Belieben bearbeitet werden, da es sich bei der Popup-Seite um eine bestimmte Seite handelt und es egal ist, was Sie möchten Zum Bearbeiten können Sie wie gewohnt vorgehen.
Vielen Dank an Bohu für die Bereitstellung des Schlüsselcodes für den gesamten Implementierungsprozess. Ohne seine Hilfe wäre ich heute nicht in der Lage, mein derzeitiges Unternehmen zu verlassen Mein herzlicher Dank geht an alle Freunde, die sich dafür einsetzen, anderen zu helfen. Deshalb werde ich alle im Projekt aufgetretenen Probleme aufschreiben, in der Hoffnung, noch mehr Menschen helfen zu können.