Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

关于05Gallery动画的一点小改进 #2

Open
dxcqcv opened this issue Jan 6, 2017 · 1 comment
Open

关于05Gallery动画的一点小改进 #2

dxcqcv opened this issue Jan 6, 2017 · 1 comment

Comments

@dxcqcv
Copy link

dxcqcv commented Jan 6, 2017

  1. 不知道有没有人和我一样,感觉点击一处后其他地方没有归位很不舒服,就改进了一下在点击时归位其他元素。
  2. 还有双击问题,还有个JS的解决方法,直接在toggle open后面toggle open-active,和原效果一致,好处是不用修改CSS
const panels = Array.from(document.querySelectorAll('.panel'));

function toggleOpen(e) {
  this.classList.toggle('open');
  this.classList.toggle('open-active');
  // get siblings
  var s = [].filter.call(this.parentNode.children, (child)=>child!==this);
  s.forEach(s=>s.classList.remove('open')) 
}


panels.forEach(panel => panel.addEventListener('click', toggleOpen));

PS:昨天在Issue里被@后才发现这里,解决了自己的一个纠结问题,真是不错,一起学习哈~

@soyaine
Copy link
Owner

soyaine commented Jan 7, 2017

欢迎多交流!~

soyaine pushed a commit that referenced this issue Sep 8, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants