|
|
| (4 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| | + | {{Template:UCSF/JixedbarStyle}} |
| | + | |
| | <html> | | <html> |
| - |
| |
| - | <body>
| |
| | <!-- jixedbar starts here --> | | <!-- jixedbar starts here --> |
| - | <style>
| |
| - | #footer-box{
| |
| - | height:70px;
| |
| - | }
| |
| - | /*----- bar style -----*/
| |
| - | .jx-bar {
| |
| - | z-index:100;
| |
| - | height:33px;
| |
| - | padding:0px;
| |
| - | width:90%;
| |
| - | background-color:#F5F2BD;
| |
| - | border:#b5b5b5 solid 3px;
| |
| - | border-top:0px;
| |
| - | }
| |
| - |
| |
| - | /* rounded top-left corner */
| |
| - | .jx-bar-rounded-tl {
| |
| - | z-index:100;
| |
| - | -webkit-border-top-left-radius:5px;
| |
| - | -khtml-border-radius-topleft:5px;
| |
| - | -moz-border-radius-topleft:5px;
| |
| - | border-top-left-radius:5px;
| |
| - | }
| |
| - |
| |
| - | /* rounded bottom-left corner */
| |
| - | .jx-bar-rounded-bl {
| |
| - | z-index:100;
| |
| - | -webkit-border-bottom-left-radius:5px;
| |
| - | -khtml-border-radius-bottomleft:5px;
| |
| - | -moz-border-radius-bottomleft:5px;
| |
| - | border-bottom-left-radius:5px;
| |
| - | }
| |
| - |
| |
| - | /* rounded top-right corner */
| |
| - | .jx-bar-rounded-tr {
| |
| - | z-index:100;
| |
| - | -webkit-border-top-right-radius:5px;
| |
| - | -khtml-border-radius-topright:5px;
| |
| - | -moz-border-radius-topright:5px;
| |
| - | border-top-right-radius:5x;
| |
| - | }
| |
| - |
| |
| - | /* rounded bottom-right corner */
| |
| - | .jx-bar-rounded-br {
| |
| - | z-index:100;
| |
| - | -webkit-border-bottom-right-radius:5px;
| |
| - | -khtml-border-radius-bottomright:5px;
| |
| - | -moz-border-radius-bottomright:5px;
| |
| - | border-bottom-right-radius:5x;
| |
| - | }
| |
| - |
| |
| - | /*----- bar separator -----*/
| |
| - | .jx-bar span {
| |
| - | z-index:100;
| |
| - | width:1px;
| |
| - | height:100%;
| |
| - | background-color:#ccc;
| |
| - | }
| |
| - |
| |
| - | .jx-separator-left {
| |
| - | z-index:100;
| |
| - | float:left;
| |
| - | }
| |
| - |
| |
| - | .jx-separator-right {
| |
| - | z-index:100;
| |
| - | float:right;
| |
| - | }
| |
| - |
| |
| - | /*----- bar button -----*/
| |
| - | .jx-bar-button ul {
| |
| - | z-index:100;
| |
| - | margin:0px;
| |
| - | padding:0px;
| |
| - | }
| |
| - |
| |
| - | .jx-bar-button li {
| |
| - | z-index:100;
| |
| - | float:left;
| |
| - | list-style:none;
| |
| - | }
| |
| - |
| |
| - | .jx-bar-button-right li {
| |
| - | z-index:100;
| |
| - | float:right;
| |
| - | list-style:none;
| |
| - | }
| |
| - |
| |
| - | .jx-bar-button li {
| |
| - | z-index:100;
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:13px;
| |
| - | cursor:pointer;
| |
| - | padding:4px 8px 4px 8px;
| |
| - | border:white solid 1px;
| |
| - | margin:2px;
| |
| - | }
| |
| - |
| |
| - | /* button hover effect */
| |
| - | .jx-bar-button li:hover {
| |
| - | z-index:100;
| |
| - | background-color:#E4FEE0;
| |
| - | border:white solid 1px;
| |
| - | padding:4px 8px 4px 8px;
| |
| - | margin:2px;
| |
| - | }
| |
| - |
| |
| - | /* rounded button corners */
| |
| - | .jx-bar-button-rounded li:hover {
| |
| - | z-index:100;
| |
| - | -webkit-border-radius:3px;
| |
| - | -khtml-border-radius:3px;
| |
| - | -moz-border-radius:3px;
| |
| - | border-radius:3px;
| |
| - | }
| |
| - |
| |
| - | /* default button's anchor text style */
| |
| - | .jx-bar-button li a:link, .jx-bar-button li a:visited {
| |
| - | z-index:100;
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:13px;
| |
| - | colProxy-Connection: keep-alive
| |
| - | Cache-Control: max-age=0
| |
| - |
| |
| - | :#ProxProxy-Connection: keep-alive
| |
| - | Cache-Control: max-age=0
| |
| - |
| |
| - | Connection: keep-alive
| |
| - | Cache-Control: max-age=0
| |
| - |
| |
| - | 6;
| |
| - | text-decoration:none;
| |
| - | padding:1px;
| |
| - | }
| |
| - |
| |
| - | .jx-bar-button li a:hover {
| |
| - | z-index:100;
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:13px;
| |
| - | color:#333;
| |
| - | text-decoration:none;
| |
| - | }
| |
| - |
| |
| - | /*----- bar text container and button arrow indicator -----*/
| |
| - | .jx-bar div, .jx-bar iframe {
| |
| - | float:left;
| |
| - | }
| |
| - |
| |
| - | .jx-bar div {
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:13px;
| |
| - | color:#666;
| |
| - | padding:4px 8px 4px 8px;
| |
| - | margin:4px 0px 4px 0px;
| |
| - | }
| |
| - |
| |
| - | .jx-bar iframe {
| |
| - | margin:4px 0px 4px 10px;
| |
| - | }
| |
| - |
| |
| - | .jx-bar div a:link, .jx-bar div a:visited {
| |
| - | color:#666;
| |
| - | text-decoration:none;
| |
| - | }
| |
| - |
| |
| - | .jx-bar div a:hover {
| |
| - | color:#0099FF;
| |
| - | text-decoration:none;
| |
| - | }
| |
| - |
| |
| - | /*----- button tooltip -----*/
| |
| - | .jx-bar-button-tooltip {
| |
| - | z-index:100;
| |
| - | height:auto;
| |
| - | padding:5px 10px 5px 10px;
| |
| - | color:#fff;
| |
| - | background-color:#36393D;
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:11px;
| |
| - | }
| |
| - |
| |
| - | /* rounded tooltip */
| |
| - | .jx-bar-button-tooltip {
| |
| - | z-index:100;
| |
| - | -moz-border-radius: 3px;
| |
| - | -webkit-border-radius:3px;
| |
| - | }
| |
| - |
| |
| - | /*----- nav menu -----*/
| |
| - | .jx-nav-menu {
| |
| - | z-index:100;
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:13px;
| |
| - | padding:2px;
| |
| - | background-color:#AFFBA2;
| |
| - | border:#AFFBA2 solid 1px;
| |
| - | }
| |
| - |
| |
| - | .jx-nav-menu-rounded {
| |
| - | z-index:100;
| |
| - | -webkit-border-radius:3px;
| |
| - | -khtml-border-radius:3px;
| |
| - | -moz-border-radius:3px;
| |
| - | border-radius:3px;
| |
| - | }
| |
| - |
| |
| - | .jx-nav-menu ul {
| |
| - | z-index:100;
| |
| - | margin:0;
| |
| - | padding:0;
| |
| - | list-style:none;
| |
| - | width:auto; /* width of menu items */
| |
| - | }
| |
| - |
| |
| - | .jx-nav-menu a:hover {
| |
| - | z-index:100;
| |
| - | background-color:#9F9FFF;
| |
| - | color:#fff;
| |
| - | text-decoration:none;
| |
| - | }
| |
| - |
| |
| - | /* styles for menu items */
| |
| - | .jx-nav-menu ul li a {
| |
| - | z-index:100;
| |
| - | display:block;
| |
| - | text-decoration:none;
| |
| - | color:#777;
| |
| - | background:#fff; /* IE6 Bug */
| |
| - | padding:8px;
| |
| - | border:1px solid #eee; /* IE6 Bug */
| |
| - | border-bottom:0px;
| |
| - | }
| |
| - |
| |
| - | /* active menu button */
| |
| - | .jx-nav-menu-active {
| |
| - | z-index:100;
| |
| - | font-family:Verdana, Arial, Helvetica, sans-serif;
| |
| - | font-size:13px;
| |
| - | cursor:pointer;
| |
| - | background-color:#E4FEE0;
| |
| - | padding:4px 8px 4px 8px;
| |
| - | margin:2px;
| |
| - | }
| |
| - |
| |
| - | /* active menu button (rounded) */
| |
| - | .jx-nav-menu-active-rounded {
| |
| - | z-index:100;
| |
| - | -webkit-border-radius:3px;
| |
| - | -khtml-border-radius:3px;
| |
| - | -moz-border-radius:3px;
| |
| - | border-radius:3px;
| |
| - | }
| |
| - |
| |
| - | /* menu indicator UP state */
| |
| - | .jx-arrow-up {
| |
| - | z-index:100;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/3/35/Jixedbar_Up.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | background-position:center;
| |
| - | }
| |
| - |
| |
| - | /* menu indicator DOWN state */
| |
| - | .jx-arrow-down {
| |
| - | z-index:100;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/d/d1/Jixedbar_Dn.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | background-position:center;
| |
| - | }
| |
| - |
| |
| - | /* tooltip point direction */
| |
| - | .jx-tool-point-dir-down {
| |
| - | z-index:100;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/5/5c/Jixedbar_Ttd.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | background-position:center bottom;
| |
| - | height:5px;
| |
| - | width:auto;
| |
| - | }
| |
| - |
| |
| - | .jx-tool-point-dir-up {
| |
| - | z-index:100;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/8/86/Jixedbar_Ttu.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | background-position:center bottom;
| |
| - | height:5px;
| |
| - | width:auto;
| |
| - | }
| |
| - |
| |
| - | /* hide and show/unhide item */
| |
| - | .jx-hide {
| |
| - | z-index:100;
| |
| - | float:right;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/b/ba/Jixedbar_Hide.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | height:16px;
| |
| - | width:16px;
| |
| - | }
| |
| - |
| |
| - | /* if showOnTop is TRUE, use "https://static.igem.org/mediawiki/2010/4/47/Jixedbar_Show.gif" instead of "" */
| |
| - | .jx-hide-top {
| |
| - | z-index:100;
| |
| - | float:right;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/4/47/Jixedbar_Show.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | height:16px;
| |
| - | width:16px;
| |
| - | }
| |
| - |
| |
| - | .jx-show {
| |
| - | z-index:100;
| |
| - | height:30px;
| |
| - | padding:0px;
| |
| - | width:40px;
| |
| - | background-color:white;
| |
| - | border:#b5b5b5 solid 1px;
| |
| - | }
| |
| - |
| |
| - | .jx-show-button {
| |
| - | z-index:100;
| |
| - | float:right;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/4/47/Jixedbar_Show.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | height:16px;
| |
| - | width:16px;
| |
| - | }
| |
| - |
| |
| - | /* if showOnTop is TRUE, use "hide.gif" instead of "show.gif" */
| |
| - | .jx-show-button-top {
| |
| - | z-index:100;
| |
| - | float:right;
| |
| - | background-image:url('https://static.igem.org/mediawiki/2010/b/ba/Jixedbar_Hide.gif');
| |
| - | background-repeat:no-repeat;
| |
| - | height:16px;
| |
| - | width:16px;
| |
| - | }
| |
| - |
| |
| - | .jx-hide-separator {
| |
| - | z-index:100;
| |
| - | width:1px;
| |
| - | height:100%;
| |
| - | background-color:#ccc;
| |
| - | float:right;
| |
| - | }
| |
| - | </style>
| |
| | <script type="text/javascript" src="http://jixedbar.rawswift.com/js/jixedbar/jquery-1.4.2.min.js"></script> | | <script type="text/javascript" src="http://jixedbar.rawswift.com/js/jixedbar/jquery-1.4.2.min.js"></script> |
| | <script type="text/javascript" src="http://jixedbar.rawswift.com/js/jixedbar/src/jquery.jixedbar.min.js"></script> | | <script type="text/javascript" src="http://jixedbar.rawswift.com/js/jixedbar/src/jquery.jixedbar.min.js"></script> |
| Line 412: |
Line 68: |
| | </div> | | </div> |
| | <!-- jixedbar ends here --> | | <!-- jixedbar ends here --> |
| - | </body>
| |
| | | | |
| - | <script>
| |
| - | var con = document.getElementById('content');
| |
| - | var bodycon = document.getElementById('bodyContent');
| |
| - | var glo = document.getElementById('globalWrapper');
| |
| - | var Bar = document.getElementById('demo-bar');
| |
| - | document.body.removeChild(glo);
| |
| - | document.body.appendChild(bodycon);
| |
| - | bodycon.remove(Bar);
| |
| - | document.append(Bar);
| |
| - | </script>
| |
| | <script type="text/javascript"> | | <script type="text/javascript"> |
| - | //$(document).ready(function() { | + | $(document).ready(function() { |
| | $("#demo-bar").jixedbar({showOnTop: true,opacity:0.93,transparent:true}); | | $("#demo-bar").jixedbar({showOnTop: true,opacity:0.93,transparent:true}); |
| - | //}); | + | }); |
| | </script> | | </script> |
| | | | |
| | | | |
| | </html> | | </html> |
"
Facebook
Twitter
Flickr
Linkedin
Content Feed
Comment Feed
