telah di uji di widget html/javascript dengan menggabung seluruh susunan.
link rell belum dipindahkan , alangkah baiknya di ubah
apabila ia tak support dengan tampilan template kalian , maka silahkan diedit widgetnya ,
<div id="scrollbar4">
<div class="scrollbar">
<div class="content">
<img src="https://0.s3.envato.com/files/15906721/images/map.jpg"/>
</div>
</div>
<div class="scroll_button right"
normal="https://0.s3.envato.com/files/15906721/images/ui/right.png"
over="https://0.s3.envato.com/files/15906721/images/ui/right_over.png">
</div>
<div class="scroll_button up"
normal="https://0.s3.envato.com/files/15906721/images/ui/up.png"
over="https://0.s3.envato.com/files/15906721/images/ui/up_over.png">
</div>
<div class="scroll_button down"
normal="https://0.s3.envato.com/files/15906721/images/ui/down.png"
over="https://0.s3.envato.com/files/15906721/images/ui/down_over.png">
</div>
<div class="scroll_button left"
normal="https://0.s3.envato.com/files/15906721/images/ui/left.png"
over="https://0.s3.envato.com/files/15906721/images/ui/left_over.png">
</div>
</div>
<style>
.scrollbar .content{
position: absolute;
}
.scrollbar {
overflow:hidden;
position: absolute;
}
.scrollbar.grab{
cursor: url(https://0.s3.envato.com/files/15906721/cursors/openhand.cur) , move !important;
cursor: -moz-grab;
cursor: move;
}
.scrollbar.grabbing{
cursor: url(https://0.s3.envato.com/files/15906721/cursors/openhand.cur) , move !important;
cursor: -moz-grabbing;
cursor: move;
}
div.scrollbar_dragger {
position: relative;
}
div.scrollbar_dragger.vertical {
float:right;
}
div.scrollbar_dragger.horizontal {
}
div.scrollbar_dragger *{
margin:0;
padding:0;
font-style:normal;
text-decoration:none;
}
div.scrollbar_dragger .back{
-webkit-transition: background-color 0.5s ease-out;
-moz-transition: background-color 0.5s ease-out;
transition: background-color 0.5s ease-out;
cursorointer;
position:absolute;
background-color:#E6E6E6;
}
div.scrollbar_dragger .back.over{
background-color:#CCCCCC;
}
div.scrollbar_dragger .dragger{
-webkit-transition: background-color 0.5s ease-out;
-moz-transition: background-color 0.5s ease-out;
transition: background-color 0.5s ease-out;
cursorointer;
position:absolute;
height:100px;
}
div.scroll_button{
height:30px;
width:30px;
position: relative;
margin:5px 0px;
margin-right:3px;
float:right;
cursorointer;
}
div.scroll_button span.hover{
height:30px;
width:30px;
position: absolute;
cursorointer;
}
</style>
<script>
/* Copyright (c) 2009 Brandon Aaron (http://brandonaaron.net)
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
* Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
* Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
*
* Version: 3.0.2
*
* Requires: 1.2.2+
*/
(function(c){var a=["DOMMouseScroll","mousewheel"];c.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var d=a.length;d{this.addEventListener(a[--d],b,false)}}else{this.onmousewheel=b}},teardown:function(){if(this.removeEventListener){for(var d=a.length;d{this.removeEventListener(a[--d],b,false)}}else{this.onmousewheel=null}}};c.fn.extend({mousewheel:function(d){return d?this.bind("mousewheel",d):this.trigger("mousewheel")},unmousewheel:function(d){return this.unbind("mousewheel",d)}});function b(f){var d=[].slice.call(arguments,1),g=0,e=true;f=c.event.fix(f||window.event);f.type="mousewheel";if(f.wheelDelta){g=f.wheelDelta/120}if(f.detail){g=-f.detail/3}d.unshift(f,g);return c.event.handle.apply(this,d)}})(jQuery);
</script>
<script src="https://0.s3.envato.com/files/15906721/js/pngFixer.js"> </script>
<script type="text/javascript" src="https://0.s3.envato.com/files/15906721/jquery/jquery-1.6.2.min.js"></script>
<script src="https://0.s3.envato.com/files/15906721/js/scrollbar.min.js"></script>
<script src="https://0.s3.envato.com/files/15906721/js/buttons.js"></script>
Tambahkan komentar Komentator
Konversi KodeOOT