Results 1 to 4 of 4

Thread: slideshows next to each other

  1. #1
    Join Date
    Jul 2010
    Posts
    64
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Default slideshows next to each other

    1) Script Title: Ultimate Fade-in slideshow (v2.4)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm

    3) Describe problem: Hello Everyone,

    I am new here and I need some help. I just recently started to build my own website. In the last two weeks I managed to learn more about html and javasript.
    I found this great script for a fade slideshow and I managed to implement it on my site. It looks great but my ultimate goal is to have 5 slideshows next to each other. However when I make a new slideshow it goes undernead the other slideshow.

    Please is there someone who can help me with this,

    many thanks in advance and kind regards

  2. #2
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    Take look at this html and css. It will give you an idea as to how it can be done.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    
    <style type="text/css">
    .slideshow {
    	height: 100px;
    	width: 100px;
    	margin-right:20px;
    	background-color:#CCC;
    	float:left;
    }
    </style>
    </head>
    
    <body>
    <div id="fadeshow1" class="slideshow"></div>
    <div id="fadeshow2" class="slideshow"></div>
    <div id="fadeshow3" class="slideshow"></div>
    <div id="fadeshow4" class="slideshow"></div>
    <div id="fadeshow5" class="slideshow"></div>
    </body>
    </html>

  3. The Following User Says Thank You to azoomer For This Useful Post:

    Rosalie (08-15-2010)

  4. #3
    Join Date
    Jul 2010
    Posts
    64
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Default

    Thanks for your reply! I will take a look at it. In an hour I have access to my computer again and then I will try to fix it.

    Quote Originally Posted by azoomer View Post
    Take look at this html and css. It will give you an idea as to how it can be done.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    
    <style type="text/css">
    .slideshow {
    	height: 100px;
    	width: 100px;
    	margin-right:20px;
    	background-color:#CCC;
    	float:left;
    }
    </style>
    </head>
    
    <body>
    <div id="fadeshow1" class="slideshow"></div>
    <div id="fadeshow2" class="slideshow"></div>
    <div id="fadeshow3" class="slideshow"></div>
    <div id="fadeshow4" class="slideshow"></div>
    <div id="fadeshow5" class="slideshow"></div>
    </body>
    </html>

  5. #4
    Join Date
    Jul 2010
    Posts
    64
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Default

    It worked!! I am so happy, Thanks

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •