How to Make Scrolling Pictures on a Webpage

Written by brandy alexander
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to Make Scrolling Pictures on a Webpage
Bring your pictures to life by scrolling them across a Web page. (Jupiterimages/Brand X Pictures/Getty Images)

If you want to design an eye-catching site using your images, consider making your pictures scroll across the page. Although this effect is typically done using a Flash player or JavaScript code, you could use HyperText Markup Language (HTML). Not only does HTML use fewer lines of markup to accomplish this effect, but lighter code is less likely to slow down your page when it loads in a browser. Understand how to apply HTML to move your images across the Web page and bring attention to your photos.

Skill level:


  1. 1

    Log in to your Web host account and upload your pictures to the same directory where your website files reside. This is typically done by clicking the "Control Panel" or "cpanel" feature, clicking the "Public_HTML" or "Public_WWW" folder and then clicking the "Browse," "Open" or "Upload" button that displays on the page. Write down the URL location of your picture files after the upload process is complete (for example, "").

  2. 2

    Start your text editor program and bring up the Web page you want to add scrolling pictures to.

  3. 3

    Position your cursor in the area where you want the images to appear. Type the following marquee tags:



    The marquee applies a scrolling behaviour to the content placed between these elements.

  4. 4

    Place your cursor between the marquee tags and enter an image source code followed by the URL address of your photo from the previous step. Include additional pictures by entering the address in a separate image tag. For example:


    <img src="" />

    <img src="" />


  5. 5

    Enter the alt attribute for each picture to describe what the photo is. Further, type in the desired image dimensions (if preferred) to control how small or large the picture appears. For instance:

    <img src="" alt="picture of the ocean" height="50" width="75" />

  6. 6

    Save your file and upload it back to your Web host to publish your scrolling pictures.

Don't Miss

  • All types
  • Articles
  • Slideshows
  • Videos
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the site, you consent to the use of cookies. For more information, please see our Cookie policy.