Show main navigation buttons on mouse over
Question:
How can I make the navigation buttons on the main image of CSS Image Gallery to appear only on mouse over?
Answer:
To hide the buttons on the main image and show them on mouse over, try the following work around:
Make the following modification of the file dmxgallery.css
(By default, it is situated in styles folder of your site.)
- Open the file dmxgallery.css, find the class dmxGallery a.dmxPrevious and change the property background-image: url( 'controlbl_prev.png' ); to background-image: url('none');
The resulting code should look like this:
.dmxGallery a.dmxPrevious
{
bottom: 5px;
left: 2px;
width: 40px;
height: 40px;
background-image: url('none');
background-position: left top;
}
- Find the class .dmxGallery a.dmxPlay and change background-image: url( 'controlbl_play.png' ); to background-image: url('none');
The resulting code should look like this:
.dmxGallery a.dmxPlay
{
position: absolute;
bottom: 5px;
left: 50%;
margin-left: -20px;
width: 40px;
height: 40px;
background-image: url('none');
background-position: right top;
}
- Find the class .dmxGallery a.dmxPause and change background-image: url( 'controlbl_pause.png' ); to background-image: url('none');
The resulting code should look like this:
.dmxGallery a.dmxPause
{
position: absolute;
bottom: 5px;
left: 50%;
margin-left: -20px;
width: 40px;
height: 40px;
background-image: url('none');
background-position: right top;
}
- Find the class .dmxGallery a.dmxNext and change background-image: url( 'controlbl_next.png' ); to background-image: url('none');
The resulting code should look like this:
.dmxGallery a.dmxNext
{
position: absolute;
bottom: 5px;
right: 2px;
width: 40px;
height: 40px;
background-image: url('none');
background-position: right top;
}DISCLAIMER:
This is extra complimentary content which purpose is to show additional usage that is not part of the product, i.e. it suggests tips for extending the functionality of the product by the users themselves. It is provided "as is", without warranty of any kind, express or implied , including but not limited to the warranties of merchantability, fitness for a particular purpose and nonfringement of third party rights.
DMXzone does not take responsibility to support the suggested content to be fully compatible and working as intended and does not provide support for extended functionality which is not included in the current release of the extension.
It is highly recommended that only more advanced developers use it.
Comments
Be the first to write a comment
You must me logged in to write a comment.