Difference between revisions of "Team:XJTU-China/Description"
| Line 38: | Line 38: | ||
<div class="side col-lg-3"> | <div class="side col-lg-3"> | ||
<nav class="dr-menu"> | <nav class="dr-menu"> | ||
| − | + | <div class="dr-trigger"><span class="dr-icon dr-icon-menu"></span><a | |
class="dr-label">Description</a> | class="dr-label">Description</a> | ||
| − | </div | + | </div> |
<ul> | <ul> | ||
<li><a class="dr-icon dr-icon-user cate" href="#part1">Part1</a></li> | <li><a class="dr-icon dr-icon-user cate" href="#part1">Part1</a></li> | ||
| Line 256: | Line 256: | ||
<!--dr-menuSliding--> | <!--dr-menuSliding--> | ||
<script> | <script> | ||
| − | |||
window.addEventListener('scroll', function () { | window.addEventListener('scroll', function () { | ||
| − | |||
var scroll = $(window).scrollTop(); | var scroll = $(window).scrollTop(); | ||
var pageHeight = $(window).height(); | var pageHeight = $(window).height(); | ||
| Line 273: | Line 271: | ||
else { | else { | ||
drMenu.show(); | drMenu.show(); | ||
| − | // | + | // drmenu到底, -5px莫名其妙 |
| − | if (scroll-5 - (0.7 * pageHeight - headerHeight) + drMenuHeight >= containerHeight) { | + | if (scroll - 5 - (0.7 * pageHeight - headerHeight) + drMenuHeight >= containerHeight) { |
drMenu.css({ | drMenu.css({ | ||
"position": "relative", | "position": "relative", | ||
| Line 280: | Line 278: | ||
}); | }); | ||
} | } | ||
| − | // | + | //滑动时，-5px莫名其妙 |
| − | else if (scroll-5 > 0.7 * pageHeight - headerHeight) { | + | else if (scroll - 5 > 0.7 * pageHeight - headerHeight) { |
drMenu.css({ | drMenu.css({ | ||
"position": "fixed", | "position": "fixed", | ||
Revision as of 03:42, 10 July 2021
hin./ious
PART1 This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left s To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon,
PART2 To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon,
PART3 the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs t To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon,
PART4 the main menu appears beneath and the menu icon slides to the right side while the label slides up.o be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up.ide menu found on YouTube. When clicking on the menu label and icon, To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up.
PART5 To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs t To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up.o be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and t To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up.he menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. >This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again. his menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again.This menu is inspired by the left side menu found on YouTube. When clicking on the menu label and icon, the main menu appears beneath and the menu icon slides to the right side while the label slides up. To close the menu, the menu icon needs to be clicked again.