dynamic css in header
Asked Modified Viewed 5,487 times
asked
A script I'm trying to use to randomly rotate the background image in my site's header requires me to add the line:
echo "<style type='text/css' media='screen'> @import url('......[path ]....../dynamic_css.php'
;</style>\n";
between the <head> tags of the v7 header template. This works fine in Internet Explorer, but Firefox wont load the script from "dynamic_css.php" because it reads the MIME type as "text/html" not "text/css":
Error message: "The stylesheet "......[ path ]....../dynamic_css.php" was not loaded because its MIME type, "text/html", is not "text/css"."
The script includes a line which should tell the browser what type of file is being sent, but Firefox, Chrome, Safari, Opera etc. don't get the message:
// tell the browser what we're sending
header('Content-type: text/css';
I can get round this by declaring the style element twice, once inside the <head> tags and once outside. The random rotation script then works OK in all the browsers, but it screws up the page layout in Internet Explorer and also has a knock on effect on the CSS Dropdown Menu, which I also use (see www.rnsyc.net).
It's a case of "nearly but not quite", but I don't understand enough to see how to resolve it (except by waiting for Happy Svensson to include bg image rotation in the next version of his HappyAccidents theme :-)).
robbie
echo "<style type='text/css' media='screen'> @import url('......[path ]....../dynamic_css.php'
;</style>\n";between the <head> tags of the v7 header template. This works fine in Internet Explorer, but Firefox wont load the script from "dynamic_css.php" because it reads the MIME type as "text/html" not "text/css":
Error message: "The stylesheet "......[ path ]....../dynamic_css.php" was not loaded because its MIME type, "text/html", is not "text/css"."
The script includes a line which should tell the browser what type of file is being sent, but Firefox, Chrome, Safari, Opera etc. don't get the message:
// tell the browser what we're sending
header('Content-type: text/css'
;I can get round this by declaring the style element twice, once inside the <head> tags and once outside. The random rotation script then works OK in all the browsers, but it screws up the page layout in Internet Explorer and also has a knock on effect on the CSS Dropdown Menu, which I also use (see www.rnsyc.net).
It's a case of "nearly but not quite", but I don't understand enough to see how to resolve it (except by waiting for Happy Svensson to include bg image rotation in the next version of his HappyAccidents theme :-)).
robbie
answered
:D
robbie
robbie
No Problem - hehe, you can't use it anyway though..
answered
@smokeman
I'm using Keff's HappyAccidents theme, which handles the header in a different way, i.e. background image + siteintro.
So your very neat code for rotating a banner image will require some tweaking of the theme.
Thanks again for the tip.
robbie
I'm using Keff's HappyAccidents theme, which handles the header in a different way, i.e. background image + siteintro.
So your very neat code for rotating a banner image will require some tweaking of the theme.
Thanks again for the tip.
robbie
Oops - there was a small error in my code - when inserting it here in the forum, there was suddently some white/blank spaces that should'nt be there.
Please copy the code above again.
Please copy the code above again.
answered
Im not sure here - I've earliere made a little script that rotates the banner in the header. Is this what your looking for ?
The script will change banner each time the page is being refreshed/loaded.
Edit: Try to see if you can use this:
1. Create a folder called banners which will be located in the directory /images/
2. In this example we use 5 banners to be chosen randomly from.
Banners / logos must be called:
banner1.gif
banner2.gif
banner3.gif
banner4.gif
banner5.gif
- And they must be in /images/banners/ - you can also use the extension .jpg images instead. Then you just change from .gif to .jpg in the code that follows below.
3. Log on to the site and go to Administration->System->Banners - here insert the following little snippet in the field "Banner 1" or "Banner 2":
[syntaxhighlighter brush=php,first-line=1,highlight=0,collapse=false,html-script=false]<?php
$logo = rand(1,5);
echo "<img src='http://www.phpfusion-tips.dk/images/bannere/banner$logo.gif' alt='0' border='0' />";
?>[/syntaxhighlighter]
- Change only the URL to your own site.
In this case we used 5 banners to be chosen randomly from. For further / less banners to choose from then you just change the number 5 in the code, corresponding to the number of banners to choose from.
The script will change banner each time the page is being refreshed/loaded.
Edit: Try to see if you can use this:
1. Create a folder called banners which will be located in the directory /images/
2. In this example we use 5 banners to be chosen randomly from.
Banners / logos must be called:
banner1.gif
banner2.gif
banner3.gif
banner4.gif
banner5.gif
- And they must be in /images/banners/ - you can also use the extension .jpg images instead. Then you just change from .gif to .jpg in the code that follows below.
3. Log on to the site and go to Administration->System->Banners - here insert the following little snippet in the field "Banner 1" or "Banner 2":
[syntaxhighlighter brush=php,first-line=1,highlight=0,collapse=false,html-script=false]<?php
$logo = rand(1,5);
echo "<img src='http://www.phpfusion-tips.dk/images/bannere/banner$logo.gif' alt='0' border='0' />";
?>[/syntaxhighlighter]
- Change only the URL to your own site.
In this case we used 5 banners to be chosen randomly from. For further / less banners to choose from then you just change the number 5 in the code, corresponding to the number of banners to choose from.
Edited by smokeman on 17-01-2011 18:51,
answered
Quote
robbieB wrote:
....... I can get round this by declaring the style element twice, once inside the <head> tags and once outside. The random rotation script then works OK in all the browsers, but it screws up the page layout in Internet Explorer and also has a knock on effect on the CSS Dropdown Menu, which I also use .....
An update for anyone interested. The problem with the layout in Internet Explorer just required some tweaking of the CSS Dropdown Menu. The other minor issue I've found was with the styles of the awec calendar infusion. In sum, the image rotation works but you can expect some minor knock-on problems with styles.
Even those minor issues may not arise if Firefox etc. could be got to load dynamic_css.php without having to declare the style element twice. Any suggestions as to how that might be done?
Thanks,
robbie
[Moderators: apologies but I first posted about this on the Themes forum (HappyAccidents theme). Maybe you'd prefer to move this thread over?]
Edited by robbieB on 17-01-2011 18:36,
answered
Quote
SimpleVision wrote:
please upload the code, which creates the problems
www.thought-after.com/2006/05/css-ran...-rotation/
SimpleVision
SimpleVision 10
- Member, joined since
- Contributed 63 posts on the community forums.
- Started 11 threads in the forums
please upload the code, which creates the problems
Category Forum
Modifications and Requests - 8Labels
None yet
Statistics
- Views 0 views
- Posts 9 posts
- Votes 0 votes
- Topic users 3 members
3 participants
smokeman 10
- Veteran Member, joined since
- Contributed 920 posts on the community forums.
- Started 79 threads in the forums
robbieB 10
- Junior Member, joined since
- Contributed 47 posts on the community forums.
- Started 9 threads in the forums
- Started this discussions
SimpleVision 10
- Member, joined since
- Contributed 63 posts on the community forums.
- Started 11 threads in the forums
Notifications
Track thread
You are not receiving notifications from this thread.
Related Questions