Is it possible to modify the background-image for a certain web page with PHP?
I'd like to but a few buttons on the top of a page so readers can select from 2
or 3 different background images (or colors) to make the page easier to read.
Can I do this kind of Dynamic HTML without using JavaScript? How do I modify my
CSS? Or do I just point the page to a different stylesheet just for the
background-image directive?
19  2579 
deko wrote:
Is it possible to modify the background-image for a certain web page
with PHP? I'd like to but a few buttons on the top of a page so readers
can select from 2 or 3 different background images (or colors) to make
the page easier to read. Can I do this kind of Dynamic HTML without
using JavaScript? How do I modify my CSS? Or do I just point the page
to a different stylesheet just for the background-image directive?
You can point to a different style sheet - or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.
--
==================
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp. js*******@attglobal.net
==================
or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.
That sounds easier than maintaining multiple stylesheets.
Do this scenario sound correct:
Put HTML buttons on the page, something like this:
<form action="" method="post" name="newbackground">
<input type="submit" value="white">
<input type="submit" value="yellow">
</form>
Then, in the head section of the page, use PHP like this:
<head>
<style type="text/css">
<?php
if (!empty($newbackground = trim($_POST['white']))
{ ?>
#page {
background-image:url(/images/background-white.gif);
<?php }
elseif (!empty($newbackground = trim($_POST['yellow']))
{ ?>
#page {
background-image:url(/images/background-yellow.gif);
<?php } ?>
</style>
</head>
Is this correct? Something tells me I'm missing something on that form...
Thanks for the help!
deko wrote:
or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.
That sounds easier than maintaining multiple stylesheets.
Do this scenario sound correct:
Put HTML buttons on the page, something like this:
<form action="" method="post" name="newbackground">
<input type="submit" value="white">
<input type="submit" value="yellow">
</form>
Then, in the head section of the page, use PHP like this:
<head>
<style type="text/css">
<?php
if (!empty($newbackground = trim($_POST['white']))
{ ?>
#page {
background-image:url(/images/background-white.gif);
<?php }
elseif (!empty($newbackground = trim($_POST['yellow']))
{ ?>
#page {
background-image:url(/images/background-yellow.gif);
<?php } ?>
</style>
</head>
Is this correct? Something tells me I'm missing something on that form...
Thanks for the help!
The $_POST array is keyed by the variable name... and your submit
buttons do not have names.
You should assign "name" attributes to your submit buttons, or use a
dropdown. I'd do it like this:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
</select>
then in your script:
<style>
<?php
$background = trim($_POST['color']);
if ($background = 'yellow'){
//yellow bg
}elseif ($background = 'blue'){
//blue bg
}else{
//default bg
}
But look ahead.. what happens when you want to change more than just
the background image? You should really just have separate themes in
separate css files, and load those corresponding stylesheets based on
the form input:
<?php
$theme = $_POST['theme']
if ($theme = 'yellow'){
//<link rel="StyleSheet" href="yellow.css" type="text/css">
}elseif ...
?>
inside the stylesheets you can define the entire theme and save
yourself a lot of work.
-sam
Thanks random, I will give it a shot and post back
"randomname" <ra*************@gmail.comwrote in message
news:11**********************@m79g2000cwm.googlegr oups.com...
>
deko wrote:
or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.
That sounds easier than maintaining multiple stylesheets.
Do this scenario sound correct:
Put HTML buttons on the page, something like this:
<form action="" method="post" name="newbackground">
<input type="submit" value="white">
<input type="submit" value="yellow">
</form>
Then, in the head section of the page, use PHP like this:
<head>
<style type="text/css">
<?php
if (!empty($newbackground = trim($_POST['white']))
{ ?>
#page {
background-image:url(/images/background-white.gif);
<?php }
elseif (!empty($newbackground = trim($_POST['yellow']))
{ ?>
#page {
background-image:url(/images/background-yellow.gif);
<?php } ?>
</style>
</head>
Is this correct? Something tells me I'm missing something on that form...
Thanks for the help!
The $_POST array is keyed by the variable name... and your submit
buttons do not have names.
You should assign "name" attributes to your submit buttons, or use a
dropdown. I'd do it like this:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
</select>
then in your script:
<style>
<?php
$background = trim($_POST['color']);
if ($background = 'yellow'){
//yellow bg
}elseif ($background = 'blue'){
//blue bg
}else{
//default bg
}
But look ahead.. what happens when you want to change more than just
the background image? You should really just have separate themes in
separate css files, and load those corresponding stylesheets based on
the form input:
<?php
$theme = $_POST['theme']
if ($theme = 'yellow'){
//<link rel="StyleSheet" href="yellow.css" type="text/css">
}elseif ...
?>
inside the stylesheets you can define the entire theme and save
yourself a lot of work.
-sam
Okay, I've got the combo box on the page:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
<option value=white>gray</option>
</select>
And I have this at the top of the page in the head section:
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
My question is this:
How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:
<select name=color onChange="post">
but no luck.
deko wrote:
Okay, I've got the combo box on the page:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
<option value=white>gray</option>
</select>
And I have this at the top of the page in the head section:
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
My question is this:
How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:
<select name=color onChange="post">
but no luck.
yes you need a form. when you have insert the form you can use this:
<select name=color onChange="document.NAMEOFTHEFORM.submit()"to
submit the Form after selecting the value.
greetingz ib************@googlemail.com wrote:
deko wrote:
>Okay, I've got the combo box on the page:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
<option value=white>gray</option>
</select>
And I have this at the top of the page in the head section:
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
My question is this:
How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:
<select name=color onChange="post">
but no luck.
yes you need a form. when you have insert the form you can use this:
<select name=color onChange="document.NAMEOFTHEFORM.submit()"to
submit the Form after selecting the value.
greetingz
Hi,
Unless you HAVE to do it with php i would do this with the following code.
<input type="button" name="colr" value="BLUE"
onclick="document.bgColor='#0000FF'">
<input type="button" name="colr" value="RED"
onclick="document.bgColor='#FF0000'">
<input type="button" name="colr" value="GREEN"
onclick="document.bgColor='#00FF00'">
<input type="button" name="colr" value="WHITE"
onclick="document.bgColor='#FFFFFF'">
<input type="button" name="colr" value="BLACK"
onclick="document.bgColor='#000000'">
Paste that into a webdoc and test!
Thanks,
Luke.
deko wrote:
Okay, I've got the combo box on the page:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
<option value=white>gray</option>
</select>
And I have this at the top of the page in the head section:
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
My question is this:
How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:
<select name=color onChange="post">
but no luck.
I suggest googling for a quick PHP tutorial on forms.
<select name=color onChange="this.form.submit()">
Should do it.
One last thing, in your PHP make sure the array you are accessing is
the correct one. $_POST retrieves all variables that were submitted
via form method=post, $_GET retrieves all variables that were submitted
via form method=get [in the url: eg:
domain.com?varname=varvalue&var2name=var2value]. $_REQUEST gets the
variables either way, but should rarely be used.
Also, as a beginniner you should take extra steps to debug your code.
Add echo statements in your php script to make sure things are
happening as planned... you'll catch a lot of bugs this way.
var_dump() also comes in handy. In this script you should do
var_dump($background) just to make sure that value is getting set
correctly.
Also, if you are interested, you can make a dummy form with lots of
different controls, and have your php script do var_dump($_POST) to see
how PHP populates the $_POST array based on a form's submission.
Luke - ea********@gmail.com wrote:
ib************@googlemail.com wrote:
>deko wrote:
>>Okay, I've got the combo box on the page:
<select name=color>
<option value=yellow>yellow</option>
<option value=white>white</option>
<option value=white>gray</option>
</select>
And I have this at the top of the page in the head section:
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
My question is this:
How do I make the page refresh after the user selects the color
preference? Do
I need to put the combo box inside a form? I tried this:
<select name=color onChange="post">
but no luck.
yes you need a form. when you have insert the form you can use this:
<select name=color onChange="document.NAMEOFTHEFORM.submit()"to
submit the Form after selecting the value.
greetingz
Hi,
Unless you HAVE to do it with php i would do this with the following code.
<input type="button" name="colr" value="BLUE"
onclick="document.bgColor='#0000FF'">
<input type="button" name="colr" value="RED"
onclick="document.bgColor='#FF0000'">
<input type="button" name="colr" value="GREEN"
onclick="document.bgColor='#00FF00'">
<input type="button" name="colr" value="WHITE"
onclick="document.bgColor='#FFFFFF'">
<input type="button" name="colr" value="BLACK"
onclick="document.bgColor='#000000'">
Paste that into a webdoc and test!
Thanks,
Luke.
Doesn't work if they have JS disabled. It also wouldn't work if he
wanted the option of an image (see the first post).
--
==================
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp. js*******@attglobal.net
==================
I suggest googling for a quick PHP tutorial on forms.
>
<select name=color onChange="this.form.submit()">
Should do it.
One last thing, in your PHP make sure the array you are accessing is
the correct one. $_POST retrieves all variables that were submitted
via form method=post, $_GET retrieves all variables that were submitted
via form method=get [in the url: eg:
domain.com?varname=varvalue&var2name=var2value]. $_REQUEST gets the
variables either way, but should rarely be used.
Also, as a beginniner you should take extra steps to debug your code.
Add echo statements in your php script to make sure things are
happening as planned... you'll catch a lot of bugs this way.
var_dump() also comes in handy. In this script you should do
var_dump($background) just to make sure that value is getting set
correctly.
Also, if you are interested, you can make a dummy form with lots of
different controls, and have your php script do var_dump($_POST) to see
how PHP populates the $_POST array based on a form's submission.
Thanks for the help, random.
The URL that needs to be reloaded (with the new background) looks like this:
http: / /www . example . com/ks042/?p=14#more-83
I discovered that I can echo the background variable using:
$background = trim($_GET['color']);
with this URL:
http: / /www . example . com/ks042/?p=14&color=white#more-83
The below form seems to work, except for the missing 'p' variable and #more
anchor:
<form name="bgcolor" method="get">
<select>
<select name=color onChange="bgcolor.submit()">
<option value=yellow>white</option>
<option value=white>yellow</option>
</select>
</form>
If the URL did NOT contain any variables or anchors, would this be the correct
way to construct the form?
How do I do it with a URL with variables?
This seems to be working:
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcolor.submit()">
<option value=white>white</option>
<option value=yellow>yellow</option>
</select>
</form>
BUT, after the page posts back, the option value in the combo box reverts back
to 'white' rather than sticking with what the user just selected.
How do I get it to stick with the user's choice on post back? Do I have to grab
that value with PHP code and then set the combo default manually? How?
Maybe adding a
>
<option value-"">select</option>
option at the top of the list
That seems to be the only way around this limitation of the element.
Unfortunately, due to other circumstances, I cannot regenerate the entire select
element (putting the selected option on top) with PHP on post back. So I am
using this:
<form name="bgcolor" action="http: / /www . example . com/ks032/?p=49"
method="post">
<select name=color onChange="bgcolor.submit()">
<option selected value=default>select background color</option>
<option value=white>white</option>
<option value=yellow>yellow</option>
<option value=gray>gray</option>
</select>
</form>
The problem I have now is the width of the combo box. The text 'select
background color' gets truncated because the combo box is too narrow. I tried
this:
<select name=color width="60" onChange="bgcolor.submit()">
and this:
<form name="bgcolor" width="60" action=" ... " method="post">
but no luck.
How do I set the width of that combo box??
Thanks in advance.
deko wrote:
This seems to be working:
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcolor.submit()">
<option value=white>white</option>
<option value=yellow>yellow</option>
</select>
</form>
BUT, after the page posts back, the option value in the combo box reverts back
to 'white' rather than sticking with what the user just selected.
How do I get it to stick with the user's choice on post back? Do I have to grab
that value with PHP code and then set the combo default manually? How?
Yes, you will need to set the selected option manually.
Try something like this:
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcolor.submit()">
<option value=white
<?=($_POST['color']=='white'?'selected':'')?>>white</option>
<option value=yellow
<?=($_POST['color']=='yellow'?'selected':'')?>>yellow</option>
</select>
</form>
>How do I get it to stick with the user's choice on post back? Do I have to
>grab
that value with PHP code and then set the combo default manually? How?
Yes, you will need to set the selected option manually.
Try something like this:
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcolor.submit()">
<option value=white
<?=($_POST['color']=='white'?'selected':'')?>>white</option>
<option value=yellow
<?=($_POST['color']=='yellow'?'selected':'')?>>yellow</option>
</select>
</form>
Unfortunately, I cannot do that in my current situation, but thanks for the tip.
I may use that elsewhere.
How do I set the width of that combo box??
got it...
<select style="width: 180px" name=color onChange="bgcolor.submit()">
hello
You can give your css file extension php and do what you want with them
like a php file.
like
..table1 {
width:<?=$urVar;?>
}
and include this file in <style .....>
Ok.
Bye
You can give your css file extension php and do what you want with them
like a php file.
like
.table1 {
width:<?=$urVar;?>
}
and include this file in <style .....>
I didn't know that. So in the <headsection of my page, would I use something
like this:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>my page with dynamic css</title>
<link href="http: // www . example . com/style.css" rel="stylesheet"
type="text/css"//for regular css
<style>
"http: // www . example . com /style.php"//for dynamic css
</style>
</head>
Does that look correct?
On Wed, 23 Aug 2006 12:26:17 -0700, deko wrote:
>>How do I get it to stick with the user's choice on post back? Do I have to
grab
that value with PHP code and then set the combo default manually? How?
Yes, you will need to set the selected option manually.
Try something like this:
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcolor.submit()">
<option value=white
<?=($_POST['color']=='white'?'selected':'')?>>white</option>
<option value=yellow
<?=($_POST['color']=='yellow'?'selected':'')?>>yellow</option>
</select>
</form>
Unfortunately, I cannot do that in my current situation, but thanks for the tip.
I may use that elsewhere.
Just to add to this thread - that I occasionally use PHP to get the
browser version (in case JS is turned off) so that I can import
different sets of (accordingly tweaked) stylesheets. It's a bit of a
kludge though, I think.
Adam.
Just to add to this thread - that I occasionally use PHP to get the
browser version (in case JS is turned off) so that I can import
different sets of (accordingly tweaked) stylesheets. It's a bit of a
kludge though, I think.
Sounds interesting. How do you get the browser info with PHP?
I liked Satya's suggestion:
You can give your css file extension php and do what you want
with them like a php file.
like
.table1 {
width:<?=$urVar;?>
}
and include this file in <style .....>
I assume it would look something like this:
<head>
<meta ... >
<title ... >
<style> http://www.example.com/style.php
</style>
</head>
I haven't tried this yet, but I assume the idea is to use $_GET in style.php.
I have a form on a page with a select drop-down that posts a 'color' value that
changes the page background color - the value resets to 'change background' (or
null) after postback. The problem is I want to add a couple of links: "normal
font" and "large font", in addition to the select background option. But if the
user clicks one of these links, the page reloads with a null post variable and,
if a background color was previously selected, it's lost after selecting the
font size.
Because the select option resets to null after the postback, I have no way of
knowing what the user had selected (if anything). So I'm not sure if a
style.php file is going to help me. And I'm not sure I want to deal with page
state just to include those font size links. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Franco Fellico' |
last post by:
Hi.
Suppose to have read and displayed (using PHP) a group of row of a DB
table on a dinamyc table on a HTML/PHP page.
The number of row displayed could be from 1 to n. Each row contains...
|
by: Charles Sullivan |
last post by:
I'm working on a program which has a "tree" of command line arguments,
i.e.,
myprogram level1 ]]
such that there can be more than one level2 argument for each level1
argument and more than one...
|
by: baumann.Pan |
last post by:
when define
char *p = " can not modify";
p ='b' ;is not allowed,
but if you declare p as
char p = "can modify";
p = 'b'; is ok?
why?
|
by: Michael B Allen |
last post by:
Is it legit to modify static data like the following code?
#include <stdlib.h>
#include <stdio.h>
struct tbl {
int i;
char *s;
};
|
by: Martin Bischoff |
last post by:
Hi,
is it possible to modify the values of a SqlDataSource's select parameters
in the code behind before the select command is executed?
Example:
I have an SqlDataSource with a...
|
by: Maxwell2006 |
last post by:
Hi,
When I run a web service project, ASP.NET shows me a default web method
invoke page.
How can I disable/modify the default test (or method invoke) page of the
ASP.NET web services?
...
|
by: Bob |
last post by:
Hi,
I have a list of widgets.
I want to iterate through the selected items collection and modify one of
the widgets properties.
I tried
foreach(widget w in lst.SelectedItems)
w.MyProperty =...
|
by: Kiran |
last post by:
Hi all,
What I am trying to do is to pass a pointer to the first element of
an array to a function, modify it in that function, and then print out
the values of the array (which has been modified...
|
by: TimEl |
last post by:
Hi.
Using Perl, I want to modify data in an XML file and print out the entire modified file, not just the elements I modify. In CPAN I have found that XPath allows me to pinpoint the elements...
|
by: no1zson |
last post by:
I have been adding buttons to my GUI to manipulate list data.
I added a Delete button this morning in case I decide I no longer needed a particular element.
I am now working on a modify button, in...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
| |
