Fix tab menus
This commit is contained in:
Garen Torikian
nightwing
parent
d5669e8127
commit
a880e2727c
5 changed files with 53 additions and 243 deletions
|
|
@ -181,50 +181,6 @@ ul.menu {
|
|||
Members and the tabs that represent them
|
||||
*/
|
||||
|
||||
.members {
|
||||
/* width: 800px; */
|
||||
/*width: 700px;*/
|
||||
/* margin: 0 10px;*/
|
||||
|
||||
height: 42px;
|
||||
left: 0;
|
||||
/* position: fixed;*/
|
||||
top: 0;
|
||||
/* transition-duration: 300ms, 300ms;
|
||||
transition-property: box-shadow, height;
|
||||
transition-timing-function: ease-out, ease-out;
|
||||
-moz-transition-duration: 300ms, 300ms;
|
||||
-moz-transition-property: -moz-box-shadow, height;
|
||||
-moz-transition-timing-function: ease-out, ease-out;
|
||||
-o-transition-duration: 300ms, 300ms;
|
||||
-o-transition-property: -o-box-shadow, height;
|
||||
-o-transition-timing-function: ease-out, ease-out;
|
||||
-webkit-transition-duration: 300ms, 300ms;
|
||||
-webkit-transition-property: -webkit-box-shadow, height;
|
||||
-webkit-transition-timing-function: ease-out, ease-out;*/
|
||||
/* width: 100%;*/
|
||||
/*transition-duration: 300ms;
|
||||
transition-property: box-shadow;
|
||||
transition-timing-function: ease-out;
|
||||
-moz-transition-duration: 300ms, 300ms;
|
||||
-moz-transition-property: -moz-box-shadow, height;
|
||||
-moz-transition-timing-function: ease-out, ease-out;
|
||||
-o-transition-duration: 300ms;
|
||||
-o-transition-property: -o-box-shadow;
|
||||
-o-transition-timing-function: ease-out;*/
|
||||
-webkit-transition-duration: 400ms, 0ms;
|
||||
-webkit-transition-property: -webkit-box-shadow, background;
|
||||
-webkit-transition-timing-function: ease-out, ease-out;
|
||||
z-index: 100;
|
||||
padding-bottom : 5px;
|
||||
overflow: visible !important;
|
||||
|
||||
/* background: #FFF;
|
||||
width: 100%;
|
||||
padding-bottom: 13px;
|
||||
top: 40px;
|
||||
position: fixed;*/
|
||||
}
|
||||
.srolled .members {
|
||||
width: 100%;
|
||||
/* -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
|
||||
|
|
@ -320,6 +276,10 @@ ul.menu {
|
|||
|
||||
}
|
||||
|
||||
ul.tabs li:first-child ul{
|
||||
left: -63px;
|
||||
}
|
||||
|
||||
.tabs a.menu:after, .tabs .dropdown-toggle:after {
|
||||
margin-top: 22px;
|
||||
}
|
||||
|
|
@ -375,14 +335,10 @@ li.dropdown {
|
|||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.members .tabs ul li {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.memberLink a {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
.menu-dropdown, .dropdown-menu {
|
||||
.menu-dropdown {
|
||||
min-width : 105px;
|
||||
max-height: 350px;
|
||||
overflow: auto;
|
||||
|
|
@ -395,9 +351,6 @@ li.dropdown {
|
|||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
}
|
||||
.dropdown-menu {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.tabs a.menu:after, .tabs .dropdown-toggle:after {
|
||||
margin-top: 13px;
|
||||
|
|
@ -445,9 +398,8 @@ li.dropdown {
|
|||
}
|
||||
.tabs .menu-dropdown, .tabs .dropdown-menu {
|
||||
border-radius: 0 0 6px 6px;
|
||||
top: 32px;
|
||||
right: 0px;
|
||||
width: 150px;
|
||||
left: 10px;
|
||||
width: 160px;
|
||||
}
|
||||
.srolled .tabs .menu-dropdown, .srolled .tabs .dropdown-menu {
|
||||
top: 32px;
|
||||
|
|
@ -508,13 +460,16 @@ header.filler {
|
|||
color: #404040;
|
||||
}
|
||||
|
||||
#sidebarContainer {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
#mainContent {
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
#documentation {
|
||||
padding-top: 15px;
|
||||
padding-left: 15px;
|
||||
padding-top: 35px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -16,17 +16,20 @@ $(function () {
|
|||
|
||||
function loadCallback(evt) {
|
||||
var form = document.getElementById("searchbox");
|
||||
var input = form.query;
|
||||
form.onsubmit = function (evt) {
|
||||
var query = input.value;
|
||||
if (query) {
|
||||
input.value = "";
|
||||
input.blur();
|
||||
var url = "https://www.google.com/search?q=" + encodeURIComponent("site:ace.ajax.org" + " " + query);
|
||||
window.open(url);
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
if (form) {
|
||||
var input = form.query;
|
||||
form.onsubmit = function (evt) {
|
||||
var query = input.value;
|
||||
if (query) {
|
||||
input.value = "";
|
||||
input.blur();
|
||||
var url = "https://www.google.com/search?q=" + encodeURIComponent("site:ace.ajax.org" + " " + query);
|
||||
window.open(url);
|
||||
}
|
||||
return false;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// init search
|
||||
|
|
@ -68,59 +71,6 @@ function ux() {
|
|||
}
|
||||
else sx = 0;
|
||||
|
||||
$('.members').each(function (i) {
|
||||
var $classContent = $(this).closest('.classContent');
|
||||
|
||||
$(this).scrollspy({
|
||||
min: $classContent.position().top + 5,
|
||||
max: $classContent.position().top + $classContent.height() - 35,
|
||||
onEnter: function (element, position) {
|
||||
var $pagination = $(element);
|
||||
var $paginationContent = $('.membersContent pos' + i);
|
||||
var $tabs = $('.tabs pos' + i);
|
||||
|
||||
$paginationContent.css('left', -1 * sx);
|
||||
$paginationContent.css('top', 0);
|
||||
|
||||
$pagination.addClass('shadow').stop().css({
|
||||
height: 31
|
||||
}).closest('.classContent').addClass('srolled');
|
||||
|
||||
$tabs.addClass('tabsSansBorder');
|
||||
},
|
||||
onLeave: function (element, position) {
|
||||
var $pagination = $(element);
|
||||
var $paginationContent = $('.membersContent pos' + i);
|
||||
var $tabs = $('.tabs pos' + i);
|
||||
|
||||
$paginationContent.stop().css({
|
||||
top: 11
|
||||
});
|
||||
$pagination.css({
|
||||
'position': 'absolute',
|
||||
'top': 193
|
||||
});
|
||||
$pagination.stop().removeClass('shadow').css({
|
||||
height: 42
|
||||
});
|
||||
|
||||
$paginationContent.css('left', 0);
|
||||
// setTimeout(function () {
|
||||
$paginationContent.css({
|
||||
'top': ''
|
||||
});
|
||||
$pagination.css({
|
||||
'position': '',
|
||||
'top': ''
|
||||
});
|
||||
$paginationContent.css('left', 0);
|
||||
$pagination.closest('.classContent').removeClass('srolled')
|
||||
$tabs.removeClass('tabsSansBorder');
|
||||
// }, 300);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$('span.methodClicker, article.article, i.methodClicker').each(function () {
|
||||
var a = $(this);
|
||||
var constructorPos = a.attr("id").indexOf("new ");
|
||||
|
|
|
|||
69
doc/template/resources/csses/ace_api.css
vendored
69
doc/template/resources/csses/ace_api.css
vendored
|
|
@ -181,50 +181,6 @@ ul.menu {
|
|||
Members and the tabs that represent them
|
||||
*/
|
||||
|
||||
.members {
|
||||
/* width: 800px; */
|
||||
/*width: 700px;*/
|
||||
/* margin: 0 10px;*/
|
||||
|
||||
height: 42px;
|
||||
left: 0;
|
||||
/* position: fixed;*/
|
||||
top: 0;
|
||||
/* transition-duration: 300ms, 300ms;
|
||||
transition-property: box-shadow, height;
|
||||
transition-timing-function: ease-out, ease-out;
|
||||
-moz-transition-duration: 300ms, 300ms;
|
||||
-moz-transition-property: -moz-box-shadow, height;
|
||||
-moz-transition-timing-function: ease-out, ease-out;
|
||||
-o-transition-duration: 300ms, 300ms;
|
||||
-o-transition-property: -o-box-shadow, height;
|
||||
-o-transition-timing-function: ease-out, ease-out;
|
||||
-webkit-transition-duration: 300ms, 300ms;
|
||||
-webkit-transition-property: -webkit-box-shadow, height;
|
||||
-webkit-transition-timing-function: ease-out, ease-out;*/
|
||||
/* width: 100%;*/
|
||||
/*transition-duration: 300ms;
|
||||
transition-property: box-shadow;
|
||||
transition-timing-function: ease-out;
|
||||
-moz-transition-duration: 300ms, 300ms;
|
||||
-moz-transition-property: -moz-box-shadow, height;
|
||||
-moz-transition-timing-function: ease-out, ease-out;
|
||||
-o-transition-duration: 300ms;
|
||||
-o-transition-property: -o-box-shadow;
|
||||
-o-transition-timing-function: ease-out;*/
|
||||
-webkit-transition-duration: 400ms, 0ms;
|
||||
-webkit-transition-property: -webkit-box-shadow, background;
|
||||
-webkit-transition-timing-function: ease-out, ease-out;
|
||||
z-index: 100;
|
||||
padding-bottom : 5px;
|
||||
overflow: visible !important;
|
||||
|
||||
/* background: #FFF;
|
||||
width: 100%;
|
||||
padding-bottom: 13px;
|
||||
top: 40px;
|
||||
position: fixed;*/
|
||||
}
|
||||
.srolled .members {
|
||||
width: 100%;
|
||||
/* -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
|
||||
|
|
@ -320,6 +276,10 @@ ul.menu {
|
|||
|
||||
}
|
||||
|
||||
ul.tabs li:first-child ul{
|
||||
left: -63px;
|
||||
}
|
||||
|
||||
.tabs a.menu:after, .tabs .dropdown-toggle:after {
|
||||
margin-top: 22px;
|
||||
}
|
||||
|
|
@ -375,14 +335,10 @@ li.dropdown {
|
|||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.members .tabs ul li {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.memberLink a {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
.menu-dropdown, .dropdown-menu {
|
||||
.menu-dropdown {
|
||||
min-width : 105px;
|
||||
max-height: 350px;
|
||||
overflow: auto;
|
||||
|
|
@ -395,9 +351,6 @@ li.dropdown {
|
|||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
}
|
||||
.dropdown-menu {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.tabs a.menu:after, .tabs .dropdown-toggle:after {
|
||||
margin-top: 13px;
|
||||
|
|
@ -445,9 +398,8 @@ li.dropdown {
|
|||
}
|
||||
.tabs .menu-dropdown, .tabs .dropdown-menu {
|
||||
border-radius: 0 0 6px 6px;
|
||||
top: 32px;
|
||||
right: 0px;
|
||||
width: 150px;
|
||||
left: 10px;
|
||||
width: 160px;
|
||||
}
|
||||
.srolled .tabs .menu-dropdown, .srolled .tabs .dropdown-menu {
|
||||
top: 32px;
|
||||
|
|
@ -508,13 +460,16 @@ header.filler {
|
|||
color: #404040;
|
||||
}
|
||||
|
||||
#sidebarContainer {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
#mainContent {
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
#documentation {
|
||||
padding-top: 15px;
|
||||
padding-left: 15px;
|
||||
padding-top: 35px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
|
|
|
|||
78
doc/template/resources/javascripts/ux.js
vendored
78
doc/template/resources/javascripts/ux.js
vendored
|
|
@ -16,17 +16,20 @@ $(function () {
|
|||
|
||||
function loadCallback(evt) {
|
||||
var form = document.getElementById("searchbox");
|
||||
var input = form.query;
|
||||
form.onsubmit = function (evt) {
|
||||
var query = input.value;
|
||||
if (query) {
|
||||
input.value = "";
|
||||
input.blur();
|
||||
var url = "https://www.google.com/search?q=" + encodeURIComponent("site:ace.ajax.org" + " " + query);
|
||||
window.open(url);
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
if (form) {
|
||||
var input = form.query;
|
||||
form.onsubmit = function (evt) {
|
||||
var query = input.value;
|
||||
if (query) {
|
||||
input.value = "";
|
||||
input.blur();
|
||||
var url = "https://www.google.com/search?q=" + encodeURIComponent("site:ace.ajax.org" + " " + query);
|
||||
window.open(url);
|
||||
}
|
||||
return false;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// init search
|
||||
|
|
@ -68,59 +71,6 @@ function ux() {
|
|||
}
|
||||
else sx = 0;
|
||||
|
||||
$('.members').each(function (i) {
|
||||
var $classContent = $(this).closest('.classContent');
|
||||
|
||||
$(this).scrollspy({
|
||||
min: $classContent.position().top + 5,
|
||||
max: $classContent.position().top + $classContent.height() - 35,
|
||||
onEnter: function (element, position) {
|
||||
var $pagination = $(element);
|
||||
var $paginationContent = $('.membersContent pos' + i);
|
||||
var $tabs = $('.tabs pos' + i);
|
||||
|
||||
$paginationContent.css('left', -1 * sx);
|
||||
$paginationContent.css('top', 0);
|
||||
|
||||
$pagination.addClass('shadow').stop().css({
|
||||
height: 31
|
||||
}).closest('.classContent').addClass('srolled');
|
||||
|
||||
$tabs.addClass('tabsSansBorder');
|
||||
},
|
||||
onLeave: function (element, position) {
|
||||
var $pagination = $(element);
|
||||
var $paginationContent = $('.membersContent pos' + i);
|
||||
var $tabs = $('.tabs pos' + i);
|
||||
|
||||
$paginationContent.stop().css({
|
||||
top: 11
|
||||
});
|
||||
$pagination.css({
|
||||
'position': 'absolute',
|
||||
'top': 193
|
||||
});
|
||||
$pagination.stop().removeClass('shadow').css({
|
||||
height: 42
|
||||
});
|
||||
|
||||
$paginationContent.css('left', 0);
|
||||
// setTimeout(function () {
|
||||
$paginationContent.css({
|
||||
'top': ''
|
||||
});
|
||||
$pagination.css({
|
||||
'position': '',
|
||||
'top': ''
|
||||
});
|
||||
$paginationContent.css('left', 0);
|
||||
$pagination.closest('.classContent').removeClass('srolled')
|
||||
$tabs.removeClass('tabsSansBorder');
|
||||
// }, 300);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$('span.methodClicker, article.article, i.methodClicker').each(function () {
|
||||
var a = $(this);
|
||||
var constructorPos = a.attr("id").indexOf("new ");
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<a href="http://github.com/ajaxorg/ace">
|
||||
<img style="z-index: 50000; position: absolute; top: 0; right: 0; border: 0;" src="https://a248.e.akamai.net/camo.github.com/e6bef7a091f5f3138b8cd40bc3e114258dd68ddf/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67" alt="Fork me on GitHub" />
|
||||
<img style="z-index: 50000; position: absolute; top: 0; right: 0; border: 0; width: 125px; height: 125px" src="https://a248.e.akamai.net/camo.github.com/e6bef7a091f5f3138b8cd40bc3e114258dd68ddf/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67" alt="Fork me on GitHub" />
|
||||
</a>
|
||||
<div id="wrapper">
|
||||
<div class="content">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue