PDA

Click to See Complete Forum and Search --> : change CSS and image based on user input

jasonbower
03-25-2004, 08:47 AM
I have a server with several folders and identically named files in each folder.

What I want to do is preview how each CSS and JPG looks together based on what the user types in.

If the user types in "FOLDER1" then I want the page to load http://www.server.com/FOLDER1/cssfile.css and http://www.server.com/FOLDER1/imagefile.jpg

I also want the ability for the user to then re-enter a new folder "FOLDER2" for instance.

Any thoughts?
Tage
03-31-2004, 03:25 AM
I created a script from what I could gather. It involves an iframe that the script writes to. Extract the folders with the zip. I hope this helps. Later...
Vladdy
03-31-2004, 06:00 AM
To begin with, make the image part of CSS by putting it in the background of a relevant element.
Then you can either make client side stylesheet switcher (requires Gecko or IE6) or server side one.
You can find Gecko code for client side stylesheet switching on this page:
www.vladdy.net/Demos/AdjuscentSiblingsFun.html
jasonbower
03-31-2004, 07:32 AM
Thanks, but I messed around and did the following:
User JavaScript Prompt and whatever user enters, is what displays.

<HTML>
<HEAD>
<SCRIPT LANGUAGE="Javascript">
var namePrompt = prompt("Enter the specific information","");
if (namePrompt == null || namePrompt == "") namePrompt = "";
function dispname (namePrompt) {
document.write(""+namePrompt+"");
}
</SCRIPT>
<BODY>
<SCRIPT LANGUAGE="Javascript">
document.write("<link rel=StyleSheet href=http://www.server.com/Branding/");
dispname(namePrompt);
document.write("/normal.css>");
</SCRIPT>

tabletags, image tags, then for the custom image,

<SCRIPT LANGUAGE="Javascript">
document.write("<img src=http://www.server.com/Branding/");
dispname(namePrompt);
document.write("/title_bar.jpg></img>");
</SCRIPT>
</body></html>


Works well for me.
Tage
03-31-2004, 07:39 AM
Bwaha, I forgot ALL about prompts! Lol! I'll keep that in mind the next time one of these problems arises... Thanks for the update. Glad you got it working. Later...