Asp. NET to achieve adaptive Picture Size pop-up window (window can be arbitrarily edited)
Source: Internet
Author: User
Asp.net| Pop-up | Adaptive in the most recent project, you have a problem that you want to achieve:
Dot Pic_small. aspx page after the thumbnail pop-up pic_all.aspx page, pic_all.aspx the size of the page according to the size of the picture automatically adjusted, and to have a picture of the description of information, you can point to a and the next page and so on.
The implementation process is as follows:
Pic_small. The code at the aspx page thumbnail is:
) "src=" <%# "images/product/" + DataBinder.Eval (Container.DataItem, "Picurl")%> ' width= ' 118 ' runat= ' server ' >
ShowWindow is saved in the Openwindows.js file as follows:
The following code can be achieved after the Point thumbnail pop-up page pic_all.aspx display picture information, the following to achieve the Pic_all.aspx page according to the size of the picture automatically adjusted.
Place the following code between the <Head></Head> of the pic_all.aspx page:
<script>
function Window.onload ()
{
var Obj=document.getelementbyid ("Picurl");
Window.resizeto (obj.offsetwidth + 127,obj.offsetheight + 75);
}
</script>
The picurl here is used to display the size of the original image in the page pic_all.aspx, I use HTML control, no matter what method you use, anyway, it is to read out the name of the picture or the path from the database.
Obj.offsetwidth get is the width of the original image displayed, Obj.offsetwidth + 127 means that the window on the width of the picture on the basis of a larger 127 pixels, because to leave some space to implement the picture description information.
This can be used to bounce out of the window can be automatically adjusted according to the size of the picture, but also free to edit the page, because the bounce out of the page is a specified page, no matter what to edit, you can deal with the same as normal processing of the page.
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.
