obdurodon / dh_course

Digital Humanities course site
GNU General Public License v3.0
20 stars 6 forks source link

Moving Dropdown Bar #323

Closed k-busko closed 4 years ago

k-busko commented 5 years ago

In class on Monday one of the projects put up on the screen (I think it was the Sherlock group) had a sidebar that moved along with the screen as you scrolled down. I think this is a great feature to include that makes for a more conducive user experience and was wondering if anyone (especially anyone from this group) had any key obstacles in creating this kind of drop menu bar? Just so if my group decides to do something similarly we know what kind of issues to anticipate.

MJB288 commented 5 years ago

My group is not using one, but I decided to look at how to do one for the sake of your question. There may be a better way of doing so, but this is the way I found.

I quickly recreated one using the code from this site on w3schools, except adjusting the dimensions to create a side bar. One issue I foresee right off the bat would be alignment. You will have to work on what dimensions to use so that the side menu is not too large, not too small, and at the same time, the rest of your site looks natural. I would suggest doing a couple pages of your site without it, then try integrating your side bar while trying to keep the your content good looking. Also, keep the side bar to a minimal if possible. Useless (or mostly useless) sidebars are more frustrating than not having one to begin with, especially if they are large or intrusive. The Dr. Seuss site we had the option of reviewing earlier in the semester is a good example of one to do, though that was for site navigation, which I'm not sure if that's what you're using it for.

As for potential CSS conflicts (because there probably is one), that will require the comments of someone else. I don't have enough experience with these yet to know what CSS may conflict with your scroll bar, and what the best way to align the page with minimal issue. I just did a simple recreation for now.