add tinyscrollbar

This commit is contained in:
devin 2012-04-05 02:31:32 +08:00
parent c4b9a9e275
commit a7d84e8583
9 changed files with 52 additions and 19 deletions

View File

@ -7,6 +7,7 @@
//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require jquery.tinyscrollbar.min
//= require bootstrap
//= require orbitdesktopAPI
//= require orbitdesktop

View File

@ -33,7 +33,7 @@ var orbitDesktop = function(dom){
};
this.bindDesktopEvents = function(){
$("a#app_manager").click(function(){
$("a#d_app_manager").click(function(){
var target = $(this).attr("href");
if(o.currenthtml!=target){
o.desktopData[o.currentface] = $(o.contentHolder).html();
@ -42,7 +42,7 @@ var orbitDesktop = function(dom){
});
}
});
$("a#desktop").click(function(){
$("a#d_desktop").click(function(){
var target = $(this).attr("href");
if(o.currenthtml!=target){
o.desktopData[o.currentface] = $(o.contentHolder).html();
@ -51,7 +51,7 @@ var orbitDesktop = function(dom){
});
}
});
$("a#sections").click(function(){
$("a#d_sections").click(function(){
var target = $(this).attr("href");
if(o.currenthtml!=target){
o.desktopData[o.currentface] = $(o.contentHolder).html();
@ -122,6 +122,7 @@ var orbitDesktop = function(dom){
}
});
$('#holder').tinyscrollbar({ axis: 'x'});
}
if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load("/desktop/"+target,function(){
@ -174,6 +175,7 @@ var orbitDesktop = function(dom){
$(".group_search").html(allApps);
return false;
})
$('#holder').tinyscrollbar({ axis: 'x'});
}
if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load("desktop_pages/"+target,function(){
@ -213,6 +215,7 @@ var orbitDesktop = function(dom){
$(".section_label ul li:not(:nth-child(1)) span.tile").hover(function(){
$(this).toggleClass("op06");
})//.mouseleave(function(){$(this).addClass("op06");});
$('#holder').tinyscrollbar({ axis: 'x'});
};
if(!o.desktopData[o.currentface]){
$(o.contentHolder).empty().load("desktop_pages/"+target,function(){
@ -299,7 +302,8 @@ orbitDesktop.prototype.themefolder = "themes";
$(this).removeClass('thmc1');
$fn_des.stop(true, true).fadeOut();
});
});

View File

@ -24,6 +24,11 @@ time, mark, audio, video {
font: inherit;
vertical-align: baseline;
}
#container input, #container textarea, #container select, #container input:focus, #container textarea:focus {
border-radius: 0;
box-shadow: none;
font: inherit;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
@ -54,7 +59,7 @@ body {
font-size: 12px;
background-color: #000;
}
a { text-decoration: none; }
a, a:hover { text-decoration: none; }
/* desktop layout */
#container {
margin: 72px 0 0 156px;
@ -69,12 +74,14 @@ a { text-decoration: none; }
position: absolute;
top: 144px;
left: 0;
z-index: 999;
z-index: 9;
}
#holder {
overflow: hidden;
overflow-x: auto;
/*overflow: hidden;
overflow-x: auto;*/
height: 540px;
width: auto;
position: relative;
}
#rwidget {
height: 516px;
@ -104,7 +111,7 @@ a { text-decoration: none; }
}
.docklist > li:hover .dock_child { display: block; }
.dock_item { float: left; }
.fn_des.thmtxt {
.fn_des.admtxt {
line-height: 60px;
padding: 0 6px;
font-size: 15px;
@ -154,7 +161,7 @@ a { text-decoration: none; }
float: left;
margin: 0 12px 0 0;
position: relative;
z-index: 99;
z-index: 9;
}
.dtitle:hover {
/* $(this).addClass( .thmc1 or .thmc2 ); */
@ -247,6 +254,19 @@ a { text-decoration: none; }
.clear { clear: both; }
/* tiny scrollbar */
#holder .viewport { width: auto; height: 516px; overflow: hidden; position: relative; }
#holder .overview { position: absolute; left: 0; top: 0; }
#holder .scrollbar {
position: absolute;
bottom: 0;
left: 0;
height: 12px;
}
#holder .track { height: 100%; width: 12px; position: relative; }
#holder .thumb { height: 12px; width: 12px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#holder .thumb .end { overflow: hidden; height: 12px; width: 12px; }
#holder .disable{ display: none; }
/* Orbit Notification */
#orbitnote {

View File

@ -13,8 +13,9 @@
</div>
<div id="holder">
<div id="group_wrapper">
<div class="scrollbar"><div class="track"><div class="thumb thmc1"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="group_wrapper" class="overview">
<div class="group g_sep op03" id='seperator' style="height: 516px;display:none;"></div>
<div class="group_search">
@ -118,4 +119,5 @@
<div class="clear"></div>
</div>
</div>
</div>
</div>

View File

@ -1,6 +1,6 @@
<div id="content">
<div id="header" class="hh3">
<div class="dtitle thmc1 w2 hh3 hp">
<div class="dtitle w2 hh3 hp">
<span class="thmtxth">Desktop</span>
<div class="section_slc admbg">
<ul>
@ -12,7 +12,9 @@
</div>
</div>
<div id="holder">
<div id="group_wrapper">
<div class="scrollbar"><div class="track"><div class="thumb thmc1"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="group_wrapper" class="overview">
<div class="group">
<ul class="grp ui-sortable">
<li class="element w2 h2 hp vp thmc1 op07" data-category="abc">
@ -104,6 +106,7 @@
<div class="clear"></div>
</div>
</div>
</div>
</div>
<div class="clear"></div>

View File

@ -55,7 +55,7 @@
</li>
<li class="d_cate"><a href="appstore" class="widget_fn wh3 hh3" id='d_appstore' onclick="return false;"><span class="widget_icon"><img src="" alt="AppStore" id="appstore_icon" width="30" height="30"/></span></a></li>
</ul>
<div class="fn_des hh3 thmc2 thmtxt"></div>
<div class="fn_des hh3 admbg admtxt"></div>
</div>
</div>
<div id="container">

View File

@ -1,11 +1,13 @@
<div id="content">
<div id="header" class="hh3">
<div class="dtitle thmc1 w2 hh3 hp">
<div class="dtitle w2 hh3 hp">
<span class="thmtxth">All Sections</span>
</div>
</div>
<div id="holder">
<div id="group_wrapper">
<div class="scrollbar"><div class="track"><div class="thumb thmc1"><div class="end"></div></div></div></div>
<div class="viewport">
<div id="group_wrapper" class="overview">
<div class="group">
<div class="section_label" >
<ul>
@ -168,4 +170,5 @@
<div class="clear"></div>
</div>
</div>
</div>
</div>

View File

@ -1,6 +1,6 @@
<div id="content">
<div id="header" class="hh3">
<div class="dtitle thmc1 w2 hh3 hp">
<div class="dtitle w2 hh3 hp">
<span class="thmtxth">Desktop</span>
<div class="section_slc admbg">
<ul>

View File

@ -1,6 +1,6 @@
<div id="content">
<div id="header" class="hh3">
<div class="dtitle thmc1 w2 hh3 hp">
<div class="dtitle w2 hh3 hp">
<span class="thmtxth">All Sections</span>
</div>
</div>