Jump to content

Changing Background Images


Recommended Posts

Guys, could you help me with this?I have this habit of trying out multiple background image in a webpage i am creating, seeing if which background image work best with the page. I am creating a function which i could simply add to any webpage that would dynamically change the background once i click on a thumbnail image.Heres how i want it somehow to work:There would be a folder where i would simply add my background-images. These images would then be displayed in thumbnail size on top of the page i am testing. Once i click on an image, it would automatically change the background-image to the image i clicked. Sort of changing background-colors, but only using images instead. And also, i want it to be automatically displaying images i added/removed from the background images folder. Meaning, i dont have to edit the code anymore, i would just simply add new or delete some images, and the function will only show images available in the folder.And heres how i did it.I used two files. list.txt and index.php.Firstly, everytime a user opens index.php a switch function is written to the text file similar to this:

switch ($x){case 'bg001.jpg':echo'<body background=bg/bg001.jpg ></body>';break;case 'bg002.jpg':echo'<body background=bg/bg002.jpg ></body>';break;}

The list.txt is re-written everytime the page is refreshed.Then i would include list.txt in index.phpafter that, the function would automatically echo links for the images similar to this:

<a href=index.php?link=bg001.jpg><img width=20 height=20 border=0 src=bg/bg001.jpg></a><a href=index.php?link=bg002.jpg><img width=20 height=20 border=0 src=bg/bg002.jpg></a>

So everytime i click on the link the background image changed to the image i clicked/selected.It worked fine. but how can i eliminate list.txt? :) I am apparently new/beginner to php. I'm still learning it. please be nice. Is there something wrong with how i wrote the code?

Link to comment
Share on other sites

here's a quick example of how I'd do it:

<body style="background-image: url('myBGdir/<?=$bg?>');"><?php//this will put all the filenames in the directory into the variable as an array$files=glob("myBGdir/".*);//go through the array and make thumbnails accordinglyfor($i=0;$i<count($files);$i++){echo "<a href='?bg={$files[i]}'><img width='50' height='50' src='{$files[i]}'></a>";}?>

The code was written on the spot and might have some errors, but it should work, and you don't need to edit any files with php!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...