Buttons are aligned with onclick selection

[ma-chino]

1) Script Title: Swiss Army Slideshow

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

3) Describe problem: I was able to set the location of my play and stop buttons using John style hooks and that is working fantastic. However, I just noticed that whenever I click on the button visual depression appear where the buttons where initially set in the program. I set the button highlight color to be the same color as my background in an attempt to hide this effect but it still continues to occur. Any help is greatly appreciated. Thanks.

Manuel A. Ayala

[jscheuer1]

This can probably be solved by using the hooks differently. That is to make sure that everything, including the depressed 'shadow' gets positioned where you want it. If all else fails, a bit of added javascript should be able to do the trick. Also, make sure you are using the most recent hooks:

http://www.dynamicdrive.com/forums/blog.php?b=18

If you want more help:

Please post a link to a page on your site that contains the problematic code so we can check it out.

[ma-chino]

John-

I have not yet posted the website. I am still in the design and coding stage. What I have as hooks for the buttons are as follows. Everything is working fine except for what I mentioned in my initial posting. If you have any suggestions as to how I can modify my style hooks please let me know. Thanks a mil.

Manuel

<style type="text/css">
#master0 td {
text-align: left;
vertical-align: top;
}

#desc0 {
position:relative;
top:-70px;
right: 668px;
text-align: right;
}

#next0 {
position:relative;
top:-105px;
width: 10px;
left: 20px;
}

#prev0 {
position:relative;
top:-105px;
width: 10px;
left: -24px;
}

#counter0 {
position:relative;
top: -70px;
left: 2px;
width: 660px;
height: 24px;
background-color: #E0E0E0;
vertical-align: middle;
margin: -2px;
padding: 6px 0px 0px 0px;
}

</style>

[jscheuer1]

I'd really have to see the page for that. I mean that is if you want to preserve the depressed button functionality, but have it look good. If so, try putting it up somewhere and giving me a link to it. All it needs is the slide show on it. It doesn't even need all the slides, 3 would be fine. But they would have to be representative of the size(s) that the slides actually are.

I'm thinking you could save yourself some trouble because it appears as though you are trying to get the controls on top. There is a configuration option for that:

slides#.controls_top=1;

But, as I say, I would need to see what you actually have to really know that.

In any case, you could do, after your new inter_slide(slides) call, like:

<script type="text/javascript">
//Notes on Parameters: The only required parameter is the slides_array_name.  If Width is used, so must Height.
//Interval is optional too.  It is always last, either fourth after Width and Height or second after Slides_array_name.
//Usage: new inter_slide(Slides_array_name, Width, Height, Interval)
new inter_slide(slides, 140, 225)
document.getElementById('prev0').parentNode.className = document.getElementById('next0').parentNode.className = 'noShade';
</script>

And then include something like so in your stylesheet:

.noShade {
padding: 0!important;
margin: 0!important;
background-color: #fff!important;
border: none!important;
}

[ma-chino]

John

The .noshade and the code worked fabulously. Thanks.

Manuel