Comments (6)
I have taken a glance at source code and felt confused with thefirstPositive.top > 200
statement here. Thought it could work well without this statement as:
if (lastNegative) {
el = lastNegative
} else if (firstPositive) {
el = firstPositive
} else {
el = els[els.length - 1]
}
And to avoid flickering in jump action, the offset
here should be set to 0
too:
jump(`#${id}`, {
duration: 300,
a11y: true,
offset: isMobile ? -60 : 0,
callback
})
As for mobile devices? Ah, I think no one will scroll the main contents with sidebar opened XD, so the flickering is not as noticeable as desktops.
from docute.
felt confused with thefirstPositive.top > 200 statement
lastNegative
---window top line---
|
| --> n px
|
firstPositive
---window bottom line---
In such case, the active section might be lastNegative
or firstPositive
, the firstPositive
is treated as active section only if its scrollTop is less than 200px
As for mobile devices? Ah, I think no one will scroll the main contents with sidebar opened
the 60px
is preserved for the space of mobileHeader
, when you click some heading in the sidebar toc, it should scroll to relevant heading in main content anyways.
from docute.
Yeah I knew the 60px
for mobiles. But I think it's not necessary to preserve 200px
for active section detection. As long as lastNegative
exists, it ought to be the active section.
|- section-1: last negative
---window top---
|
|- seciton-2: first positive
|
---window bottom---
scroll =>
|- section-2: last negative
---window top---
|
|- seciton-3: first positive
|
---window bottom---
On this condition, firstPositive
will only be treated as the active section when it across window top line (i.e. it turns into lastNegative
).
from docute.
As long as lastNegative exists, it ought to be the active section.
um, what if the last section is very long and only several pixels left in viewport? 🤔 wouldn't the next section being treated as active section sound more reasonable?
btw, how can I reproduce the bug in your screenshot?
from docute.
But you see: when you click on a sidebar item, the page will scroll to the very beginning of target section - it somehow indicates that "a section is activated when it reaches the very top".
what if the last section is very long and only several pixels left in viewport
Well, for an opposite example, what if the last section is so short that it turns into inactive while there're still 90% of it are visible?
from docute.
Since it seems we will never reach a consensus on this issue, I'm going to close it 🙃
from docute.
Related Issues (20)
- Documentation does not indicate how to install HOT 1
- Multi-level menu
- Fix Repl.it example HOT 1
- Question: How to change the theme of code highlight?
- Deploy to gitlab pages
- Multilanguage with LTR and RTL languges HOT 2
- Ability for a standalone file:// is broken HOT 3
- Select has inverted colors in dark theme
- Theme search function
- api.onUpdate causes rendering to fail
- Support explicit markdown URLs like docsify
- double horizontal scroll bar in code snippets
- use with `router-link`
- [Feature Request] any chance we get React in markdown support?
- Bug: The vue template doesn't work on the sidebar!
- Bug: "router.base" not work! HOT 1
- Unable to jump between level 1 menus
- docute.org seems to be dead HOT 3
- People visiting docute.egoist.sh are getting HACKED HOT 2
- Is this project still under maintenance?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from docute.