Here is the code, hope it will be useful. This version had been tailored to meet my requirement. after apply it to a listbox, it looks like the following.
Also there is very good article http://www.codeproject.com/Articles/37366/Styling-A-ScrollViewer-Scrollbar-In-WPF explain the structure of Scrollbar and how to change it.
1: <SolidColorBrush x:Key="ScrollBarDisabledBackground" Color="#F4F4F4"/>
2: <Style x:Key="VerticalScrollBarPageButton" TargetType="{x:Type RepeatButton}">
3: <Setter Property="OverridesDefaultStyle" Value="true"/>
4: <Setter Property="Background" Value="Transparent"/>
5: <Setter Property="Focusable" Value="false"/>
6: <Setter Property="IsTabStop" Value="false"/>
7: <Setter Property="Template">
8: <Setter.Value>
9: <ControlTemplate TargetType="{x:Type RepeatButton}">
10: <Rectangle Fill="{TemplateBinding Background}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}"/>
11: </ControlTemplate>
12: </Setter.Value>
13: </Setter>
14: </Style>
15: <Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
16: <Setter Property="OverridesDefaultStyle" Value="true"/>
17: <Setter Property="IsTabStop" Value="false"/>
18: <Setter Property="Template">
19: <Setter.Value>
20: <ControlTemplate TargetType="{x:Type Thumb}">
21: <Border Background="#FF868686" BorderThickness="0,0,1,0" Height="Auto" CornerRadius="4" />
22: </ControlTemplate>
23: </Setter.Value>
24: </Setter>
25: </Style>
26: <Style x:Key="HorizontalScrollStyle" TargetType="{x:Type ScrollBar}">
27: <Setter Property="Background" Value="Transparent"/>
28: <Setter Property="Template">
29: <Setter.Value>
30: <ControlTemplate TargetType="{x:Type ScrollBar}">
31: <Grid x:Name="Bg" Background="{TemplateBinding Background}" Height="10" SnapsToDevicePixels="true">
32: <Grid.RowDefinitions>
33: <RowDefinition />
34: </Grid.RowDefinitions>
35: <Track x:Name="PART_Track" IsDirectionReversed="true" IsEnabled="{TemplateBinding IsMouseOver}">
36: <Track.DecreaseRepeatButton>
37: <RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/>
38: </Track.DecreaseRepeatButton>
39: <Track.IncreaseRepeatButton>
40: <RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/>
41: </Track.IncreaseRepeatButton>
42: <Track.Thumb>
43: <Thumb Style="{StaticResource ScrollBarThumb}" Cursor="Hand"/>
44: </Track.Thumb>
45: </Track>
46: </Grid>
47: <ControlTemplate.Triggers>
48: <Trigger Property="IsEnabled" Value="false">
49: <Setter Property="Background" TargetName="Bg" Value="{StaticResource ScrollBarDisabledBackground}"/>
50: </Trigger>
51: </ControlTemplate.Triggers>
52: </ControlTemplate>
53: </Setter.Value>
54: </Setter>
55: </Style>
56: <Style x:Key="AppleStyleVerticalScrollBarStyle" TargetType="{x:Type ScrollBar}">
57: <Setter Property="Template">
58: <Setter.Value>
59: <ControlTemplate TargetType="{x:Type ScrollBar}">
60: <Grid x:Name="Bg" SnapsToDevicePixels="true" Width="10" HorizontalAlignment="Right" Margin="0">
61: <Grid.RowDefinitions>
62: <RowDefinition />
63: </Grid.RowDefinitions>
64: <Track x:Name="PART_Track" IsDirectionReversed="true" IsEnabled="{TemplateBinding IsMouseOver}">
65: <Track.DecreaseRepeatButton>
66: <RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource VerticalScrollBarPageButton}" />
67: </Track.DecreaseRepeatButton>
68: <Track.IncreaseRepeatButton>
69: <RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/>
70: </Track.IncreaseRepeatButton>
71: <Track.Thumb>
72: <Thumb Style="{DynamicResource ScrollBarThumb}" Cursor="Hand"/>
73: </Track.Thumb>
74: </Track>
75: </Grid>
76: </ControlTemplate>
77: </Setter.Value>
78: </Setter>
79: </Style>
80: <ControlTemplate x:Key="AppleStyleScrollBarStyle" TargetType="{x:Type ScrollViewer}">
81: <Grid x:Name="Grid" Background="{TemplateBinding Background}">
82: <Grid.ColumnDefinitions>
83: <ColumnDefinition Width="*"/>
84: <ColumnDefinition Width="Auto"/>
85: </Grid.ColumnDefinitions>
86: <Grid.RowDefinitions>
87: <RowDefinition Height="*"/>
88: <RowDefinition Height="Auto"/>
89: </Grid.RowDefinitions>
90: <Rectangle x:Name="Corner" Grid.Column="1" Fill="{x:Null}" Grid.Row="1"/>
91: <ScrollContentPresenter x:Name="PART_ScrollContentPresenter" CanContentScroll="{TemplateBinding CanContentScroll}"
92: CanHorizontallyScroll="False" CanVerticallyScroll="False"
93: ContentTemplate="{TemplateBinding ContentTemplate}"
94: Content="{TemplateBinding Content}" Grid.Column="0"
95: Margin="{TemplateBinding Padding}" Grid.Row="0"/>
96: <ScrollBar x:Name="PART_VerticalScrollBar" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
97: AutomationProperties.AutomationId="VerticalScrollBar" Cursor="Arrow" Grid.Column="1"
98: Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Grid.Row="0"
99: Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
100: ViewportSize="{TemplateBinding ViewportHeight}" Style="{DynamicResource AppleStyleVerticalScrollBarStyle}"
101: Background="{x:Null}" Width="Auto" Margin="0"/>
102: <ScrollBar x:Name="PART_HorizontalScrollBar" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
103: AutomationProperties.AutomationId="HorizontalScrollBar" Cursor="Arrow" Grid.Column="0"
104: Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Orientation="Horizontal" Grid.Row="1"
105: Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
106: ViewportSize="{TemplateBinding ViewportWidth}" Style="{DynamicResource HorizontalScrollStyle}"/>
107: </Grid>
108: </ControlTemplate>