• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Image Box


#1
Hey peeps

I am looking for a image box that will say every 10 seconds change image if that makes sence.
iv searched for something along these lines and i cant find anything, iv been pointed towards lightbox 2 which is not what im looking for.

WSZ Joinery | Home

in the top right part of the body is where i would place it so it would need to be able to be defined what size the box can be.

Thanks for your help.

Adam
 
#4
Thanks for your replies,

Looking into the Easy Slider1.5 and im just playing about, im not great at this so silly question incoming.
How do i implement it, iv moved the folders and files into my directory for the site and iv copied and pasted the code into my index but its not putting the scripts in it, any clues ?

Thanks
 
#8
Ohhhh now i feel really low :icon_blushing: , slight issue is i can only upload to host before 4pm and after 12pm , i got limited usage.. not long moved house so im currently using mobile broadband... its Great........... :icon_thumbdown:

i can take a screenshot of it on dreamweaver if that helps ahaha or il just leave it till i can upload it tonight ?


Adam
 

Corrosive

Well-Known Member
#9
Ohhhh now i feel really low :icon_blushing: , slight issue is i can only upload to host before 4pm and after 12pm , i got limited usage.. not long moved house so im currently using mobile broadband... its Great........... :icon_thumbdown:

i can take a screenshot of it on dreamweaver if that helps ahaha or il just leave it till i can upload it tonight ?


Adam
Ha, ha. We all have off days. As much as I'd like to pick my way through a DW screenshot I need to test links etc to debug where you have gone wrong so upload it and drop me a PM and I'll take a look tomorrow a.m.
 
#11
sorry for the long reply, had a busy weekend out on the town ... :p

i had a look at your sites code but it showed it up as a jumble so i gave up haha.
i put in the viewer or how i thought i put it in but it managed to screw up my div tags so i had to go back and remove half of it and re do it.. fun times.

will give it another bash just now. this is it just now, still the same

WSZ Joinery | Home

thanks
 

Corrosive

Well-Known Member
#12
OK, cool.

First up you need to close your unordered list;

Code:
<div id="slider"> 
			<ul>				
				<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li> [COLOR="Red"][B]</ul>[/B][/COLOR]
Then you need to link to the correct javascript files in your head tags (obviously making sure the are pointed to the right place);

Code:
<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/easySlider1.5.js"></script>

<script type="text/javascript">

	$(document).ready(function(){	

		$("#slider").easySlider();

	});	

</script>
The link references above show the javascript files sat in a folder called 'js' in the root of your website. Which is how I generally arrange javascript files for sites.

Then copy the CSS styles;

Code:
/* Easy Slider */



	#slider ul, #slider li{

		margin:0;

		padding:0;

		list-style:none;

		}

	#slider li{ 

		/* 

			define width and height of list item (slide)

			entire slider area will adjust according to the parameters provided here

		*/ 

		width:696px;

		height:241px;

		overflow:hidden; 

		}

	span#prevBtn{}

	span#nextBtn{}					



/* // Easy Slider */
Into your stylesheet and alter to suit.

Come back when you've done all that and let me know if it is working.