Move Prev Next buttons in slideshow

patpending74 / 2010-04-28 04:15:09   

Hi,

I am trying to move the Prev Next buttons in slideshow to the bottom of my menu.

Does anyone know how I can do this?

http://www.markblower.com

Thank you,

Mark

rickykappa / 2010-04-28 06:39:40   

hi, this has been asked/answered many times, you can find a lot of info if you type your question in the search box on top of the forum
;-)

patpending74 / 2010-04-28 07:52:06   

Thanks for your reply rickykappa but I have spent hours searching and still can't find an answer, hence my post.

I'm really stuck and any help would be much appreciated.

rickykappa / 2010-04-28 08:09:04   

actually I must admit I didn't read carefully enough your post, at the first sight I didn't notice you mention menu :-/
I would try assigning in your css file a position:fixed; to the div (or span, I don't remember exactly and I'm not watching at the actual plugin now...) where the prev-next buttons are.
hope this makes sense, at least for a starting point...
;-)

patpending74 / 2010-04-28 08:26:02   

Thank you rickykappa

I have tried

#navigation {
left:12px;
position:fixed;
top:600px;
}

as a starting point, but it just moves the whole slideshow down a bit

lemathieu A / 2010-04-28 09:25:01   

as it is in some themes,

  1. /* SLIDE SHOW - Navigation */
  2.     
  3. ¬†¬†¬†¬†p.nav a {
  4. ¬†¬†¬†¬†¬†¬†¬†¬†background-color: #eeeeee;
  5. ¬†¬†¬†¬†¬†¬†¬†¬†padding-top: 3px;
  6. ¬†¬†¬†¬†¬†¬†¬†¬†padding-right: 9px;
  7. ¬†¬†¬†¬†¬†¬†¬†¬†padding-bottom: 3px;
  8. ¬†¬†¬†¬†¬†¬†¬†¬†padding-left: 9px;
  9. ¬†¬†¬†¬†¬†¬†¬†¬†font-size: 11px;
  10. ¬†¬†¬†¬†¬†¬†¬†¬†font-family: Georgia, serif;
  11.         -moz-border-radius-bottomleft:3px;
  12.         -moz-border-radius-bottomright:3px;
  13.         -moz-border-radius-topleft:3px;
  14.         -moz-border-radius-topright:3px;
  15.     }
  16.     
  17. ¬†¬†¬†¬†p.nav a:hover {
  18. ¬†¬†¬†¬†¬†¬†¬†¬†background-color: #cccccc;
  19.     }
  20.     
  21. ¬†¬†¬†¬†p.nav span#num {
  22. ¬†¬†¬†¬†¬†¬†¬†¬†letter-spacing: 2px;
  23. ¬†¬†¬†¬†¬†¬†¬†¬†font-family: Georgia, serif;
  24. ¬†¬†¬†¬†¬†¬†¬†¬†font-style: italic;
  25. ¬†¬†¬†¬†¬†¬†¬†¬†padding-left: 20px;
  26.     }
patpending74 / 2010-04-28 09:27:59   

and I added

div id='navigation'

in the slideshow plug in.

Now the prev next buttons are just where I want them but the slideshow has moved with them!

Any thoughts?

patpending74 / 2010-04-28 21:05:18   

Hi lemathieu,

Thanks for getting back to me. Through your help and trial and error I feel like I'm getting close...

I have tried this which puts the buttons pretty much where I want them but makes them appear in the same spot. ie the prev button is on top of the next button or vice versa

/* SLIDE SHOW - Navigation */

p.nav a {
        left:12px;
        position:fixed;
        top:580px;
        
padding-top: 3px;
padding-right: 9px;
padding-bottom: 3px;
padding-left: 9px;
font-size: 10px;
font-family: Verdana, sans-serif;
-moz-border-radius-bottomleft:3px;
-moz-border-radius-bottomright:3px;
-moz-border-radius-topleft:3px;
-moz-border-radius-topright:3px;
}

p.nav a:hover {
background-color:#E3CEF6;
}

Any further suggestions? I am very new to this and trying my best..!

patpending74 / 2010-04-28 21:08:49   

thanks also to rickykappa obv

patpending74 / 2010-04-28 21:35:23   

I have pared it down to:

/* SLIDE SHOW - Navigation */

p.nav a {
        left:12px;
        position:fixed;
        top:580px;
}

p.nav a:hover {
background-color:#E3CEF6;
}

p.nav span#num {
    
        left:24px;
        position:fixed;
        top:580px;
        
padding-left: 20px;
}

Which leaves me with the PREV NEXT buttons on top of each other but in the right place and the separating line (like a hyphen but vertical) still at the top in the CONTENT section.

I feel I am very close but am now stuck again. Any help much appreciated.

markblower.com

Thanks, Mark

Vaska A / 2010-04-29 11:02:54   

You know what I think...

I think you delete the Prev button and only use the Next button (unless you plan to have more than 15 images in a set or so).

This design is coming along. Are you going to get rid of the " | " at the top of the page too? Other people will be interested this...

(I'm really rambling here...haha)

It's a curious problem...you might try adding something like this just to see what the effect is on the Next Prev links:

  1. p.nav a { display: block; }

Maybe this will lead to a new idea and solution. ;)

rickykappa / 2010-04-30 11:39:54   

hey mark, looks like you gave up?
I saw your attempt but I couldn't answer that time.
what a pity: you were really close to manage it...

patpending74 / 2010-05-02 09:01:43   

Thank you Vaska I will give it a go

patpending74 / 2010-05-02 09:03:44   

Hey rickykappa. I've not given up, I just didn't want to leave mistakes in my live website.

patpending74 / 2010-05-02 09:15:57   

Hi vaska,

I tried your suggestion and it seems to have no effect on the Next Prev links.

I am also very keen to keep the Prev button...

drumswek / 2010-05-02 20:45:23   

Hi,

I'd like to put prev and next button at the bottom too, i found this code

p.nav {

color:#000000;
font-size:11px;
font-weight:bold;
left:923px;
line-height:40px;
position:fixed;
text-align:left;
text-transform:uppercase;
top:590px;

p.square-nav {
position:fixed;
top:590px;
}

I placed buttons exactly where i want, but there is not link on my button now ..

rickykappa / 2010-05-03 08:20:58   

@patpending - hi, I've seen you've put the page back, but I'm busy now, will come later...

@drumswek - what & where? if nobody can see the problem, nobody can help!
;-)

patpending74 / 2010-05-03 08:36:50   

Thanks rickykappa, look forward to hearing from you.

rickykappa / 2010-05-03 15:09:02   

hey Mark, looks like you were really close to it: that's what I did on a downloaded copy of your files:
p.nav a { } /*< you can even erase that!*/

p.nav {display: block;
        left:12px;
        position:fixed;
        top:580px;
     }
that's all, and here on my screen it works!
(btw: good shots! if I come to london and need a studio I know whom to ask! ;-)

rickykappa / 2010-05-03 15:51:09   

one more note: you might want to check how it works with different os/browsers, I'm using pc/firefox...

... and obviously I meant "to ask some info, at least!"
;-)

drumswek / 2010-05-03 16:36:06   

@rickykappa

i saw the example here: http://les-monstres.fr/index.php?/project/veryshow/

i paste this code in my style.css :

.nav {
color:#FFFFFF;
font-size:35px;
font-weight:bold;
left:606px;
line-height:40px;
position:fixed;
text-align:left;
text-transform:uppercase;
top:582px;
}
.square-nav {
position:fixed;
top:582px;
}

changed the values to center buttons

and finally the links are valid with internet explorer but dead with firefox and safari

i tried to change this code many times with many examples here , but always the same result ..

www.drumswek.fr

thanks for your help

drumswek / 2010-05-03 16:37:16   

i tried too ,to put

display: block;

in the code, but changes nothing

rickykappa / 2010-05-03 16:58:43   

@drumswek - not sure to understand, I can't see an example page in your website, and I can't see a link back to indexhibit either... did you read the forum rules?

drumswek / 2010-05-03 17:35:38   

There are some exposition on my page where there are no slideshow, because it doesn't
finish !!
But check Drum* or Maps* or LostSpots*

I know i deleted " built with indexhibit " in the menu, but i 'm gonna create later a " links*" exposition "
where indexhibit will have his place there,
i know Vaska and others worked hard on this project ...
.. for noob developper like me !!

There is a french proverb " all work deserves wage "
That's why i will make a donation too
I'm not trying to propose money to getting help, i'm not like this : )

drumswek / 2010-05-03 17:35:39   

There are some exposition on my page where there are no slideshow, because it doesn't
finish !!
But check Drum* or Maps* or LostSpots*

I know i deleted " built with indexhibit " in the menu, but i 'm gonna create later a " links*" exposition "
where indexhibit will have his place there,
i know Vaska and others worked hard on this project ...
.. for noob developper like me !!

There is a french proverb " all work deserves wage "
That's why i will make a donation too
I'm not trying to propose money to getting help, i'm not like this : )

patpending74 / 2010-05-03 22:34:52   

rickykappa you are my hero!!!

Thanks so much!

Also many thanks to Vaska

Best wishes,

Mark

rickykappa / 2010-05-04 09:14:24   

@drumswek - your question is more or less the same of Mark and the answers above should apply more or less to you too.
besides being a hero for a day, I'm a user as you and him, therefore I follow the simple rules here, it is not my or your home...
;-)

spl72 / 2011-01-11 05:28:30   

sorry to be late, pain, otherwise, I have spent time looking and I'm a wondering which plugin you started here with mark?

using Iwakami2 plugin and would like to get the navigation into a similar place... had troubles understanding a lot of code and php not so good... css will be the fine but just getting it written correctly first..

idocumentspace.com is whereI'm at... not spray yet.... yes I'll be donating if i can get this right...

thanks justin

spl72 / 2011-01-11 05:29:00   

sorry to be late, pain, otherwise, I have spent time looking and I'm a wondering which plugin you started here with mark?

using Iwakami2 plugin and would like to get the navigation into a similar place... had troubles understanding a lot of code and php not so good... css will be the fine but just getting it written correctly first..

idocumentspace.com is whereI'm at... not spray yet.... yes I'll be donating if i can get this right...

thanks justin

This thread has been closed, thank you.