dream css image slider
Does anyone ever use this slider: http://www.dreamcss.com/2009/04/create-beautiful-jquery-sliders.html.
I need someone's advice on how to remove the navigation and only show while o开发者_运维问答n hover.. thanks
Im not sure how you want to remove the navigation but then show (the images?) on hover?
Do you mean you want the images to slide when you hover over the links? And you want the Title and Description bar removed?
Remove the background img from the css :
div#header div#slide-holder div#slide-controls{
left:0;
bottom:228px;
width:973px;
height:46px;
display:none;
position:absolute;
//remove this>>
<strike>background:url(images/slide-bg.png) 0 0;<strike>
}
Remove these two elements in the html:
<p id="slide-client" class="text"><strong>post: </strong><span></span></p>
<p id="slide-desc" class="text"></p>
In script.js look for this line:
$('#slide-nav').append('<a id="slide-link-'+i+'" href="#" **onclick**="slider.slide('+i+');return false;" onfocus="this.blur();">'+(i+1)+'</a>');
Change the onclick to mouseOver
In response to your clarification: Put this on the top inside the body or head(not sure which is faster)
<script type="text/javascript>
$(document).ready(function{
//hide the nav when page loads
$("#slide-nav").hide();
//show and hide on hover
$("#slide-holder").hover(
function () {
$(this).show();
},
function () {
$(this).hide();
}
);
})
</script>
Haven't tested this..Really hope that helps you
精彩评论