Em um projeto recente, encontrei um problema para conseguir esse efeito:
Após clicar na miniatura da página pic_small.Aspx, a página pic_all.aspx aparecerá. O tamanho da página pic_all.aspx deve ser ajustado automaticamente de acordo com o tamanho da imagem e deve conter informações descritivas da imagem. Você também pode clicar na imagem anterior e na próxima para virar a página.
O processo de implementação é o seguinte:
O código na miniatura da página pic_small.Aspx é:
<IMG id="imgPic" style="CURSOR: mão" border=0 height="95" onclick="ShowWindow(<%#DataBinder.Eval(Container.DataItem,"ID")%>)" src='< %#"Images/Product/" + DataBinder.Eval(Container.DataItem,"PicUrl")%>' width="118" runat="server">
ShowWindow é salvo no arquivo OpenWindows.js com o seguinte conteúdo:
function Mostrar janela (id)
{
window.open('pic_all.aspx?ID=' + id,'_blank','Barras de rolagem=não');
}
O código a seguir pode perceber que após clicar na miniatura, a página pic_all.aspx irá aparecer para exibir as informações da imagem. O que será implementado a seguir é que a página pic_all.aspx se ajuste automaticamente de acordo com o tamanho da imagem.
Coloque o seguinte código entre <Head></Head> na página pic_all.aspx:
<script>
função janela.onload()
{
var obj=document.getElementById("PicUrl");
window.resizeTo(obj.offsetWidth + 127,obj.offsetHeight + 75);
}
</script>
O PicUrl aqui é usado para exibir o tamanho original da imagem na página pic_all.aspx. Eu uso o controle html. Não importa o método usado, você deve ler o nome ou caminho da imagem no banco de dados.
obj.offsetWidth obtém a largura da imagem original exibida. obj.offsetWidth + 127 significa que a janela é 127 pixels maior que a largura da imagem, pois é necessário deixar algum espaço para implementar as informações de descrição da imagem.
Desta forma, a janela pop-up pode ser ajustada automaticamente de acordo com o tamanho da imagem, e a página pop-up pode ser editada à vontade, pois a página pop-up é uma página designada, e não importa o que você queira para editar, você pode lidar com isso normalmente.
Agradeço a Bohu por fornecer o código-chave para todo o processo de implementação. Sem a ajuda dele, eu não seria capaz de concluir o projeto hoje e não seria capaz de deixar minha empresa atual com tranquilidade. meus sinceros agradecimentos a todos os amigos que estão entusiasmados em ajudar os outros, por isso escreverei todos os problemas encontrados no projeto, na esperança de ajudar mais pessoas.