Carol's Easy HTML

Marquee Slideshow

Making your own Marquee Slideshow is very easy. The first thing you will need to do is select some photographs for your slideshow. After you have chosen your photos you will need to upload them to an image host. PHOTOBUCKET is great for this.

If you do not know how to save photographs to your computer and upload them to an image host then I highly recommend you click IMAGES and read my tutorial before continuing this section.

I have SO MANY cool Marquee Codes to show you. Take your time looking through them. I know you will find just right slideshow for you and your Avon website. Let's have some fun!

* Most of the Marquee codes work properly only in Internet Explorer. Some of the codes may work with Firefox, but not all of them. Sorry FireFox users. :(

HTML Marquee Codes

A Marquee creates a scrolling display. You can add text, images or a combination of both, to each marquee. You can also change the 'behavior' or 'direction' of your slideshow to left, right, up, down, bounce, etc.

* PLEASE NOTE - If you're using Photobucket for your Avon website you must substitute your own information in place of mine. Just insert your Photobucket DIRECT LINK (second code - as shown in the photo below) in place of my blue text.

For example - Look closely at the code below. Everything in BLUE will be replaced with YOUR Photobucket code.

This is what your code should look like after you have replaced my blue text with your Photobucket code -

<img src="http://i67.photobucket.com/albums/h292/carvia/emmitt_02.jpg">

You can add as many photos as you like to your Marquee Slide Show. Take a look at the code below -

<marquee direction="left">
<img src="your filename.gif (or.jpg)">
<img src="your filename.gif (or.jpg)">
<img src="your filename.gif (or.jpg)">
</marquee>

I have 3 photos in my slideshow. To add more I will simply copy and paste this part of the code -

<img src="your filename.gif (or.jpg)">

And add it into my Marquee Code. Like this -

<marquee direction="left">
<img src="your filename.gif (or.jpg)">
<img src="your filename.gif (or.jpg)">
<img src="your filename.gif (or.jpg)">
<img src="your filename.gif (or.jpg)">
</marquee>

I now have four photographs in my slideshow. That was easy, wasn't it? Let's move on to the codes.

I scroll to the left.

I scroll to the right.

I scroll up.

I scroll down.

I scroll right AND left.

My 'behavior' is alternate.

I Zigzag

I'm all over the place!

Fancy Schmancy
marquee slideshows

The next few codes are a little more complicated than the others. But I know you can do it! There are just a few changes you will need to make inside of the following codes to make your slideshow uniquely yours.

As always, you must substitute your own information where you see the blue "your filename.gif (or.jpg)". The filename is the DIRECT LINK (second code) from photobucket.

Marquee with text and dotted image border

If you would like to change my Avon Sneak Peek just change all wording in Fuschia. All you have to do is insert your words in place of mine.

To change my font colors just change my Fuschia numbers (#FF00AA) to any color you like.

You can also change my border color. To do this just change my Green numbers (#55AE3A) to any that you choose.

AVON

SNEAK

PEEK

<center>
<marquee direction="left">

 AVON 
<img src="your filename.gif (or.jpg)" STYLE="BORDER: dotted 3px #55AE3A">

 SNEAK 
<img src="your filename.gif (or.jpg)" STYLE="BORDER: dotted 3px #55AE3A">

 PEEK 
<img src="your filename.gif (or.jpg)" STYLE="BORDER: dotted 3px #55AE3A">
</MARQUEE>
</center>

Slideshow with color background

To change the background color just insert the color code you like in place of my #FF00AA.

Slideshow inside a colored table - with a border

In this code you must again substitute your own information where you see the blue "your filename.gif (or.jpg)" The filename is the DIRECT LINK (second code) from Photobucket.

You can change the background color by changing my #4DC5D6 to any background color you like.

You can also change my border color. To do this just change my numbers #FF00AA to any you choose.

Another Slideshow inside a colored table - with a border

THIS SUMMER BE PREPARED

DON'T LEAVE HOME WITHOUT IT!

The Code

Marquee with background and animated logo

IT'S A NEW DAY, A NEW YOU

The Code

Marquee Slideshow -
Changing the Speed

The higher the scrollamount number, the faster your marquee goes! If you wish you can set your scroll amount to "100" for a SUPER fast marquee. I don't think anyone will be able to see your photos at that speed but it's your show. :)

To change the speed of your slideshow you will need to add this line into your Marquee code, right after the MARQEE DIRECTION or behavior, as shown below -

<scrollamount="15">

Just change my blue 15 to any number you choose.

Top of Page

visitors are currently browsing this site

Marquee Slideshow

Categories