Difference between revisions of "Template:ITB Indonesia"
Arkairfani (Talk | contribs) |
Arkairfani (Talk | contribs) |
||
| Line 2: | Line 2: | ||
<script> | <script> | ||
| − | + | // This is the jquery part of your template. | |
| − | + | // Try not modify any of this code too much since it makes your menu work. | |
| − | + | $(document).ready(function() { | |
| − | + | $("#HQ_page").attr('id',''); | |
| − | + | // call the functions that control the menu | |
| − | + | menu_functionality(); | |
| − | + | hide_show_menu(); | |
| − | + | //this function controls the expand and collapse buttons of the menu and changes the +/- symbols | |
| − | + | function menu_functionality() { | |
| − | + | //when clicking on a "menu_button", it will change the "+/-" accordingly and it will show/hide the corresponding submenu | |
| − | + | $(".menu_button").click(function(){ | |
| − | + | // add or remove the class "open" , this class holds the "-" | |
| − | + | $(this).children().toggleClass("open"); | |
| − | + | // show or hide the submenu | |
| − | + | $(this).next('.submenu_wrapper').fadeToggle(400); | |
| − | + | }); | |
| − | + | // when the screen size is smaller than 800px, the display_menu_control button appears and will show/hide the whole menu | |
| − | + | $("#display_menu_control").click(function(){ | |
| − | + | $('#menu_content').fadeToggle(400); | |
| − | + | }); | |
| − | + | // call the current page highlight function | |
| − | + | highlight_current_page(); | |
| − | + | } | |
| − | + | // call the highlight current page function to show it on the menu with a different background color | |
| − | + | function highlight_current_page() { | |
| − | + | // select a page from the menu based on the id assigned to it and the current page name and add the class "current page" to make it change background color | |
| − | + | $("#"+ wgPageName.substring(wgPageName.lastIndexOf("/")+1, wgPageName.length ) + "_page").addClass("current_page"); | |
| − | + | // now that the current_page class has been added to a menu item, make the submenu fade in | |
| − | + | $(".current_page").parents(".submenu_wrapper").fadeIn(400); | |
| − | + | // change the +/- symbol of the corresponding menu button | |
| − | + | $(".current_page").parents(".submenu_wrapper").prev().children().toggleClass("open"); | |
| − | + | ||
| − | + | } | |
| − | + | // allow button on the black menu bar to show/hide the side menu | |
| − | + | function hide_show_menu() { | |
| − | + | ||
| − | + | // in case you preview mode is selected, the menu is hidden for better visibility | |
| − | + | if (window.location.href.indexOf("submit") >= 0) { | |
| − | + | $(".igem_2017_menu_wrapper").hide(); | |
| − | + | } | |
| − | + | // if the black menu bar has been loaded | |
| − | + | if (document.getElementById('bars_item')) { | |
| − | + | // when the "bars_item" has been clicked | |
| − | + | $("#bars_item").click(function() { | |
| − | + | $("#sideMenu").hide(); | |
| − | + | // show/hide the menu wrapper | |
| − | + | $(".igem_2017_menu_wrapper").fadeToggle("100"); | |
| − | + | }); | |
| − | + | } | |
| − | + | // because the black menu bars loads at a different time than the rest of the page, this function is set on a time out so it can run again in case it has not been loaded yet | |
| − | + | else { | |
| − | + | setTimeout(hide_show_menu, 15); | |
| − | + | } | |
| − | + | } | |
| − | + | }); | |
| Line 93: | Line 93: | ||
/***************************************************** DEFAULT WIKI SETTINGS ****************************************************/ | /***************************************************** DEFAULT WIKI SETTINGS ****************************************************/ | ||
| − | + | ||
| − | + | /* Clear the default wiki settings */ | |
| − | + | ||
| − | + | #home_logo, #topMenu { display:none; } | |
| − | + | #topMenu, #top_title, .patrollink {display:none;} | |
| − | + | #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;} | |
| − | + | body {background-color:white; } | |
| − | + | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | |
| Line 124: | Line 124: | ||
background-color: #131514; | background-color: #131514; | ||
font-family: verdana; | font-family: verdana; | ||
| − | + | width:100%; | |
} | } | ||
| Line 161: | Line 161: | ||
.container a:hover, .dropdown:hover .dropbtn { | .container a:hover, .dropdown:hover .dropbtn { | ||
background-color: #4CAF50; | background-color: #4CAF50; | ||
| − | + | color: black; | |
} | } | ||
| Line 253: | Line 253: | ||
} | } | ||
| − | + | ||
.column .full_size { | .column .full_size { | ||
| − | + | width:100%; | |
| − | + | } | |
.column.full_size img { | .column.full_size img { | ||
| − | + | width:97%; | |
| − | + | padding: 10px 15px; | |
| − | + | } | |
.column.half_size { | .column.half_size { | ||
| − | + | width: 50%; | |
| − | + | } | |
.column.half_size img { | .column.half_size img { | ||
| − | + | width: 94.5%; | |
| − | + | padding: 10px 15px; | |
| − | + | } | |
.igem_2017_content_wrapper { | .igem_2017_content_wrapper { | ||
| − | + | width: 81%; | |
| − | + | margin: 2%; | |
| − | + | display:block; | |
| − | + | float:left; | |
| − | + | background-color:white; | |
| − | + | font-family:Tahoma, Geneva, sans-serif; | |
| − | + | } | |
</style> | </style> | ||
| Line 489: | Line 489: | ||
</navbar> | </navbar> | ||
<!-- END NAVBAR --> | <!-- END NAVBAR --> | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
Revision as of 23:37, 24 October 2017
