Hi, I've a div with a list inside, each element contains a <a> tag and a
<p> tag with a class that is hidden for default.
I post some code for better explain:
<div id="news_eventi">
<ul>
<li>
<a href="#"
onclick="$('.surprise').hide('slow');$('#news_3').show('slow');return false;">
+ 19-06-2007 09:09 <strong>tre</strong>
</a>
<p id="news_3" class="surprise">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi
enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis
nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in
hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu
feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui
blandit p
</p>
</li>
<li>
<a href="#"
onclick="$('.surprise').hide('slow');$('#news_4').show('slow');return false;">
+ 19-06-2007 09:09 <strong>quattro</strong>
</a>
<p id="news_4" class="surprise">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy
nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi
enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis
nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in
hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu
feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui
blandit p
</p>
</li>
</div>
The div news_eventi has a fixed height, and overlow:auto, then, when a
click on the title of a very long news the browser display the classic
default scrollbar.
And now my question:
There's a way to replace the beaviour of the browser putting 2 images of
a arrow for manage the scrolling of the div?
In a few words I want to change the styles for the scrollbars.
Can you suggest me a way or a point of start?
Thank you very much :-)
