Advanced Search

Results 1 to 6 of 6

Thread: Ultimate Fade-in slideshow (v2.4) - help with navigation control placement

  1. #1
    Join Date
    Jul 2010
    Location
    USA, Los Angeles, California
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Smile Ultimate Fade-in slideshow (v2.4) - help with navigation control placement

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

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

    3) Describe problem: First, thank you for all these scripts and for taking the time to answer questions. I have searched for the answer to my problem in the forum, but did not find it. What do i do to display the - navigational controls "slideshowtoggler" - on both left and right sides of my slideshow, here is an example -

    .

    Right now they display under my slideshow,

    , Thank You!!!

    Hereis the slideshow script that i have on my webpage.

    Code:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="http://zakayf.ucoz.com/kayf/slideshow/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: [902, 270], //width/height of gallery in pixels. Should reflect dimensions of largest image
     imagearray: [
     ["http://kayfuem.ucoz.net/IMG-BDX-2.png", href="http://www.facebook.com/pages/North-Hollywood-CA/DBX-DiamondBlackExteriors/117653694936734?ref=mf", "_new", "2ServeVinyl - CAR WRAPS, CARBON FIBER, RACING STRIPES, STICKERS, DECALS, CUSTOM LETTERING, TAILLIGHT, COVERS, HEADLIGHT COVERS AND MUCH MORE JUST FOR YOUR CAR, MAKE IT LOOK BETTER, CONTACT US NOW!!!"],
     ["http://kayfuem.ucoz.net/IMG-BDX.png", href="http://www.facebook.com/pages/North-Hollywood-CA/DBX-DiamondBlackExteriors/117653694936734?ref=mf", "_blank", "DBX"] //<--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: "peekaboo",
     togglerid: "slideshowtoggler",
      oninit:function(curimage, index){
      var setting=this.setting
      var showid="<b>Slideshow ID:</b> " + setting.wrapperid + "<br />"
      var showdimensions="<b>Slideshow Dimensions:</b> " + setting.dimensions + "<br />"
      var totalimages="<b>Total Images:</b> " + setting.imagearray.length + "<br />"
      var firstimagelink="<b>First slide is hyperlinked to:</b> " + setting.imagearray[0][1] + "<br />"
      jQuery('#info').html(showid+showdimensions+totalimages+firstimagelink)
     }
    })
    
    </script>
    <div id="fadeshow1"></div>
     <div id="slideshowtoggler">
    <a href="#" class="prev"><img src="http://kayfuem.ucoz.net/Slider/btn_prev.png" style="border-width:0" /></a> <span class="status" style="margin:0 50px; font-weight:bold"></span> <a href="#" class="next"><img src="http://kayfuem.ucoz.net/Slider/btn_next.png" style="border-width:0" /></a>
    </div>
    Last edited by zakayf; 07-04-2010 at 08:22 PM.

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

    Default

    If you find the css for #fadeshow2toggler (or what you have named it) and also make a class named .prev and one named .next you can place the controls where you want. Play around with width and height and margins ( positive and negative). Post a link to your site if you need more help
    Last edited by azoomer; 07-04-2010 at 09:21 PM.

  3. #3
    Join Date
    Jul 2010
    Location
    USA, Los Angeles, California
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    azoomer - You probably didn't take a look at the script that i have posted above, i already have those classes in my script, the only thing i need to know is how to put them(navigational controls) on both left and right sides of my slideshow. And also the right place in the script to put. Thats all i need to know and my web url is : http://kayfuem.ucoz.net/

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

    Default

    I am aware that these classes are in the javascript. That is why I am referring to them. I was merely suggesting that you use these classes in your styles. For example by adding something like this
    Code:
    <style type="text/css">
    #slideshowtoggler { 
        margin-top:-180px; 
        height:180px;
    }
    .prev { 
        float:left;
        margin-left:-30px;
    }
    .next { 
        float:right; 
        margin-right:-30px;
    } 
    </style>
    In the head section of your page. Adjust it to your needs.

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

    zakayf (07-05-2010)

  6. #5
    Join Date
    Jul 2010
    Location
    USA, Los Angeles, California
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank You very much azoomer. You helped me alot, and it works now just as i wanted. Thanks one more time for your help

  7. #6
    Join Date
    Dec 2005
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Thanks!!

    I was totallly stumped on this too - your answer has fixed my problem

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
  •