Add anchor points to post list page
* post-year now has anchor point, you can click on it or input url with hash tag to jump to a specific year. * See #39
This commit is contained in:
parent
e6177e0fde
commit
028dc62e3b
7 changed files with 16 additions and 5 deletions
|
@ -86,6 +86,12 @@ if (header !== null) {
|
||||||
listen('#img-btn', "click", showImg);
|
listen('#img-btn', "click", showImg);
|
||||||
listen('.bg-img', "click", hideImg);
|
listen('.bg-img', "click", hideImg);
|
||||||
|
|
||||||
|
document.querySelectorAll('.post-year').forEach((ele)=> {
|
||||||
|
ele.addEventListener('click', () => {
|
||||||
|
window.location.hash = '#' + ele.id;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
window.addEventListener('scroll', throttle(() => {
|
window.addEventListener('scroll', throttle(() => {
|
||||||
autoHideHeader();
|
autoHideHeader();
|
||||||
|
|
||||||
|
|
|
@ -408,6 +408,11 @@ p.img-404 {
|
||||||
margin-right: 1.8em;
|
margin-right: 1.8em;
|
||||||
font-size: 1.6em;
|
font-size: 1.6em;
|
||||||
@include dimmed;
|
@include dimmed;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.posts-list {
|
.posts-list {
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
{{- end }}
|
{{- end }}
|
||||||
{{- range .Data.Pages.GroupByDate "2006" }}
|
{{- range .Data.Pages.GroupByDate "2006" }}
|
||||||
<div class="posts-group">
|
<div class="posts-group">
|
||||||
<div class="post-year">{{ .Key }}</div>
|
<div class="post-year" id="{{ .Key }}">{{ .Key }}</div>
|
||||||
<ul class="posts-list">
|
<ul class="posts-list">
|
||||||
{{- range .Pages }}
|
{{- range .Pages }}
|
||||||
<li class="post-item">
|
<li class="post-item">
|
||||||
|
|
|
@ -6,4 +6,4 @@ mobileMenuVisible=false;}}
|
||||||
const showImg=()=>{document.querySelector('.bg-img').classList.add('show-bg-img');}
|
const showImg=()=>{document.querySelector('.bg-img').classList.add('show-bg-img');}
|
||||||
const hideImg=()=>{document.querySelector('.bg-img').classList.remove('show-bg-img');}
|
const hideImg=()=>{document.querySelector('.bg-img').classList.remove('show-bg-img');}
|
||||||
const toggleToc=()=>{document.getElementById('toc').classList.toggle('show-toc');}
|
const toggleToc=()=>{document.getElementById('toc').classList.toggle('show-toc');}
|
||||||
if(header!==null){listen('#menu-btn',"click",toggleMobileMenu);listen('#toc-btn',"click",toggleToc);listen('#img-btn',"click",showImg);listen('.bg-img',"click",hideImg);window.addEventListener('scroll',throttle(()=>{autoHideHeader();if(mobileMenuVisible==true){toggleMobileMenu();}},250));}
|
if(header!==null){listen('#menu-btn',"click",toggleMobileMenu);listen('#toc-btn',"click",toggleToc);listen('#img-btn',"click",showImg);listen('.bg-img',"click",hideImg);document.querySelectorAll('.post-year').forEach((ele)=>{ele.addEventListener('click',()=>{window.location.hash='#'+ele.id;});});window.addEventListener('scroll',throttle(()=>{autoHideHeader();if(mobileMenuVisible==true){toggleMobileMenu();}},250));}
|
|
@ -1 +1 @@
|
||||||
{"Target":"js/main.min.8f39f24808e9d0a9b02da58c2d2838da859dc0b7bdfadbdb1883aae8b6adacfe.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-jznySAjp0KmwLaWMLSg42oWdwLe9+tvbGIOq6LatrP4="}}
|
{"Target":"js/main.min.784417f5847151f848c339cf0acb13a06cbb648b1483435a28ed4556c4ead69b.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-eEQX9YRxUfhIwznPCssToGy7ZIsUg0NaKO1FVsTq1ps="}}
|
File diff suppressed because one or more lines are too long
|
@ -1 +1 @@
|
||||||
{"Target":"css/style.min.c693329ce3bac2503f88115a4011a284a06d53e30f484562a37664dc4c5f0a74.css","MediaType":"text/css","Data":{"Integrity":"sha256-xpMynOO6wlA/iBFaQBGihKBtU+MPSEVio3Zk3ExfCnQ="}}
|
{"Target":"css/style.min.31706917653d2b9e8410abd431f30ec4359a88a94fc87a63654779d87329edec.css","MediaType":"text/css","Data":{"Integrity":"sha256-MXBpF2U9K56EEKvUMfMOxDWaiKlPyHpjZUd52HMp7ew="}}
|
Loading…
Reference in a new issue