News homepage solution

Community feedback

• 

  Hassan El Jebyly•490

  @hassaneljebylyPosted about 1 year ago

  congrats on finishing this project looks solid and responsive, one thing I noticed is when you click to close the nav then resize to desktop It stays closed, that's because your javascript changes the style attribute, instead what I would suggest is writing a class to do the opening and closing of the nav via nav.classList.toggle("open")

  nav {
   transform: translateX(0%);
  }
  
  .open {
   transform: translateX(200%);
  }
  

  this way transform is removed from the element. another thing is when you resize the window you can see the nav slide to right when it hits the breakpoint, that's because you have transition: 0.6s; changing it to transition: transform 0.6s ease; solves the issue, or you can just stop animations during window resizing.

  this might be useful : Responsive navbar tutorial using HTML CSS & JS

  good luck :)

  Marked as helpful

  1

  ---

  

  Inci Huseynli•310

  @incihuseynliPosted about 1 year ago

  @hassaneljebyly Thank you so much for great advice and resource :)

  0