/    Sign up×
Community /Pin to ProfileBookmark

change CSS and image based on user input

Copy linkTweet thisAlerts:
Mar 25.2004

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 [url]http://www.server.com/FOLDER1/cssfile.css[/url] and [url]http://www.server.com/FOLDER1/imagefile.jpg[/url]

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

Any thoughts?

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@TageMar 31.2004 — 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...

[upl-file uuid=0fd757bd-4449-4c01-bf1d-af4a8d7fe045 size=3kB]loadimgcss.zip[/upl-file]
Copy linkTweet thisAlerts:
@VladdyMar 31.2004 — 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
Copy linkTweet thisAlerts:
@jasonbowerauthorMar 31.2004 — [B]Thanks, but I messed around and did the following:

User JavaScript Prompt and whatever user enters, is what displays.[/B]

<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>


[B] Works well for me. [/B]
Copy linkTweet thisAlerts:
@TageMar 31.2004 — 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...
×

Success!

Help @jasonbower spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...