Dynamic Background Images - February 2012
This tip-of-the-month demonstrates how to dynamically change the background image of the body, form, panel or table using VB.Net code. I have long tried various methods to change the body's background and until today have been unsuccessful. I decided to share the solution in this February 2012 tip-of-the-month.
The Asp.Net, VB.Net, VS/2008 project DynamicBackgroundImage is documented using a screen capture:
Click here to run the demo application.
Click one of the buttons to change the appropriate background image.
For example: Click the 'TableMain' button to change the tables background image.
Eight different images are distributed with this demo.
Continue clicking the buttons to cycle through the images.
Images can be found using a Google search with arguments: 'seamless repeating background'
Give the body tag an ID and set it to run at the server.
Part of the Aspx Page <body id="BodyMain" runat="server">
<form id="FormMain" runat="server">
<asp:Button ID="buttonNextBody" runat="server" Text="Next Body" />
<asp:Button ID="buttonNextForm" runat="server" Text="Next Form" />
<asp:Panel ID="PanelMain" runat="server">
<asp:Button ID="buttonNextPanel" runat="server" Text="Next Panel" />
<asp:Table ID="TableMain" runat="server">
<asp:Button ID="buttonNextTable" runat="server" Text="Next Table" />
Sample VB.Net Code Me.BodyMain.Style.Add("background-image", "url(Images/Background/00100WhiteClouds.jpg)")
It is then possible to refer to the tag in the VB.Net code.
The same is true for the form, panel and table.
I don't know what will happen if the folder or file name contains blanks.
I did try surrounding the name with double quotes and it did not work.
Maybe single quotes will work. Let me know what you find out.
Typically I have one master page per application. And it is in the root folder. And the content pages are in subfolders. After much trial and error I found that the URL needed to point to a lower level folder. Using '../' to redirect to the lower level. The master page code behind would be similar to:
Repeat for each level the page is higher than the master page. For example: If the page is in folder 'MyPages/Process/Login' then '../../../' would need to be used.
I found an inspiration for this tip at: http://www.groupsrv.com/dotnet/about28275.html. I had been using a tilde and slash with the URL and it does not work.
This does not work:
Download the source code by clicking on the zipped file name. Click here to run the demo application.
Download - Source Zipped File Size VS/2008 VB.Net, ASP.Net Solution DynamicBackgroundImage.zip 528k
Previous Tip Tip Index Next Tip