Results 1 to 5 of 5

Thread: Fadeslideshow - overlay?

  1. #1
    Join Date
    Dec 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Fadeslideshow - overlay?

    Hi, I was wondering if someone could help me out with the awesome fadeslideshow script? I'm basically looking to have some text in a div tag overlap the slideshow slightly so that the text (and the border around it) are on top of the slideshow images.

    I works fine when it's a static image via HTML, but as soon as I drop the fadeslideshow then it gets bumped behind instead. I've tried using z-index and zIndex but can't seem to get it to work. I'm not very advanced with HTML and CSS and know almost nothing about JS.

    Would anyone be able to help please?


    Cheers
    Graham

  2. #2
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 516 Times in 502 Posts
    Blog Entries
    5

    Default

    Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format when asking a question.

  3. #3
    Join Date
    Dec 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Ultimate Fadeshow

    Opps, sorry. Here's the code in the HTML page:


    Code:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    
    <script type="text/javascript" src="http://www.x.co.uk/v2/assets/fadeslideshow.js">
    
    //***********************************************
    //* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
    //* This notice MUST stay intact for legal use
    //* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
    //***********************************************
    
    </script>
    
    <script type="text/javascript">
    
    
    var mygallery=new fadeSlideShow({
    	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
    	dimensions: [1400, 450], //width/height of gallery in pixels. Should reflect dimensions of largest image
    	imagearray: [
    		["http://www.x/v2/waste-type-banner/1.jpg"],
    		["http://www.x/v2/waste-type-banner/2.jpg"],
    		["http://www.x/v2/waste-type-banner/3.jpg"],
    		["http://www.x/v2/waste-type-banner/4.jpg"],		
    		["http://www.x/v2/waste-type-banner/5.jpg"],
    		["http://www.x/v2/waste-type-banner/6.jpg"] //<--no trailing comma after very last image element!
    	],
    	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
    	persist: false, //remember last viewed slide and recall within same session?
    	fadeduration: 500, //transition duration (milliseconds)
    	descreveal: "ondemand",
    	togglerid: ""
    })
    
    </script>
    and then there's this:

    Code:
    <div id="image">
      <div id="image-wrapper">
      <div id="fadeshow1"></div>
        <div id="image-content1header"> SKIP LOADING GUIDELINES</div>
        </div>
    </div>
    With the "image-content1headeer" tag being the bit I need to be on top of the ultimateslideshow!

    I know it must be possible as it's done on this site where the three columns (Acorn Group, Corporate Responsibility and Acorn News) cut into the js image part above.

    aemg.co.uk


    I've been trying out this dropped straight into the HTML page and it's working expect I can't get the damn div tag to centre properly. Usually the 50% left margin and halving the width works but not in this case!

    Code:
    #image #image-wrapper #image-content1header {
    	position:absolute;
    	top:560px;
    	width:-700px;
    	height:38px;
    	z-index:1000;
    	left: 50%;
    }
    Cheers

  4. #4
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    46
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    Do you have a link to a page you can show us? If not, could you post it as a jsfiddle?
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

  5. #5
    Join Date
    Dec 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi, I've managed to find the solution, was missing a CSS attribute with the old 50% trick. Cheers!

Similar Threads

  1. Help with FadeSlideShow
    By farrimondo in forum Dynamic Drive scripts help
    Replies: 5
    Last Post: 03-13-2012, 03:54 PM
  2. Where and How do I put fadeslideshow.js ?
    By Snowhammer in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-05-2011, 09:42 AM
  3. fadeslideshow.js
    By robburne in forum Dynamic Drive scripts help
    Replies: 6
    Last Post: 10-07-2010, 10:01 AM
  4. FadeSlideShow
    By marquezs in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 03-31-2010, 01:58 PM
  5. fadeslideshow
    By Alex_lnx in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 01-11-2010, 01:33 AM

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
  •