...

View Full Version : CSS and random image question?



student101
11-07-2007, 02:40 PM
This is a two part question.

First part:

CSS wont work if used in my page when a linked CSS file is used already?
If I cut out a section of the CSS and paste it in my document it doesn't work.


Second part:
How to get random images based on CSS value entries?
Currently am using different CSS files for different pages.

Page_one.php => page_one.css attached.
Page_two.php => page_two.css attached.

This is not the way I prefer to code my sites.
How to fix?

abduraooft
11-07-2007, 03:36 PM
First part:
CSS wont work if used in my page when a linked CSS file is used already?
If I cut out a section of the CSS and paste it in my document it doesn't work.

The external CSS might be in a different folder, then the image paths will be relative to the CSS file, not with html


Second part:
How to get random images based on CSS value entries?
Currently am using different CSS files for different pages.
Page_one.php => page_one.css attached.
Page_two.php => page_two.css attached.

You haven't specified the element on to which you are applying image(hopefully background). Anyway the best methode to set a page dependent background is, to write that particular CSS in the same file.
PS: I don't think it's a PHP related question.

mlseim
11-07-2007, 03:42 PM
You can use inline CSS for things that change (in that one instance) ...

Example, the background image here will overwrite the one in the CSS file.
<body style="background: url(mynewpic.jpg);">

For random images, javascripting or PHP. I recommend PHP myself.

student101
11-07-2007, 09:24 PM
Thank you for your response here guys.
I may not have it to clear in my first question or problem.

On my page I have this:


<head>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>

I would like to have only this part in my pages head section, but still have the css file attached.
Currrently this does not work.


<head>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#header {
margin: 0px;
width: 774px;
height:100px;
background-image: url(../images/image_1.jpg);/* this part I would like to make random*/
background-repeat: no-repeat;
position:relative;
}
</style>
</head>


Any ideas?

mlseim
11-07-2007, 09:39 PM
Try this ... not fully what you're looking for, but it might trigger some ideas ...

<head>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/header.css" rel="stylesheet" type="text/css" />
</head>


This is the file called: header.css

#header {
margin: 0px;
width: 774px;
height:100px;
background-image: url(../images/image_1.jpg);/* this part I would like to make random*/
background-repeat: no-repeat;
position:relative;
}

It's OK to specify more than 1 CSS file in your <head> section.

Now the random part ... will be trickier.

student101
11-07-2007, 09:46 PM
Thanks, didn't see that one.

Here is the random part.


<img src="images/image_<?php echo(rand(1,3)); ?>.jpg" /> // This is for your idea in previous post.


//This is for my idea in my resolve
#header {
margin: 0px;
width: 774px;
height:100px;
background-image: url(../images/image_<?php echo(rand(1,3)); ?>.jpg);/* this part I would like to make random*/
background-repeat: no-repeat;
position:relative;
}

Have fun

Thanks again, will try it though.

student101
11-07-2007, 09:53 PM
Sorry forgot to add that you would name your image files like this:

image_1.jpg
image_2.jpg
image_3.jpg

Then it would work.

Cheers

matak
11-08-2007, 12:34 AM
awesome code!
thanks

student101
11-08-2007, 07:10 AM
Glad you like, but problem still not solved.

Inigoesdr
11-08-2007, 06:50 PM
Post the current code you're using and what exactly doesn't work.

student101
11-10-2007, 04:30 PM
Sorry never got the mail.

Problem is solved by copying entire CSS code above </head> section.

Cheers

VIPStephan
11-10-2007, 04:50 PM
Another waste of time of four members here due to the inability to switch on the brain before posting and to provide enough information. :mad:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum