Hi. I want get a specific layout with some animation but i want get it without faking or get too js code... My sample is here https://code.sololearn.com/WNA347f85pQD/#html which has some problem like scolling position of actived item.
My question is: like you would implement this layout?
First of all this is so cool view template😍
Back to issue:
The problem is that the clicking on items that are lower opens the view on top but screen stays at same scroll position.
I had this same issue in below code, so what I did was every time we click an item we scroll to the top of screen, which made sure that view always open on top of screen.
// line 355 and 356 in my code
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
But the problem with this solution was, the list will also scroll back to top and we ll lose the scroll position where item was actually clicked.
maybe we can save scroll position and scroll back to it after closing the item view.
KrOW another solution would be to make
If in case you want scroll to happen for stuffs inside #content then you can do so in a div within #contents
Awesome bro but
As you said
It's really hard to tell
weather implement this or not
Yes very much efficiency though I don't know who the actual end user's and there old/new/some(beta) types browsers and also matters that they ,Are they are in desktop view or iOS typo web , mobile version
I have seen some websites suffers to deliver best in Safari browsers
this answer is for the question " would you implement this layout ?"
5% for some browsers
10%users + Thier device's
Can you make like this
For active item
it will disappears in minimiez format
not only in css style
ill wanted to see in js to
Morpheus First, thank you 😉 Second, yes its another problem. Your can be solved (in part) using a fixed element than overlay the content. Mine problem is more subtle. In practice, like i have developed, its hard (maybe impossible) to keep the item in "active" state (eg. on appearing bar) on scrolling because it have to change the positioning type destroying all. Of course it can be developed in other manners but i trying to find the "cleaner" one (without massice use of js and without too relayouts by browser).
Charan LEo25 Animation is part of layout here 😉. Futhermore its your choice implement or not.. Are welcomed good ideas too than, obliviouslly, are better supported by codes. I dont want thief other codes, i want a confront with other developers, above all those more good than me ✌... its necessary for learn more
Morpheus I thinked a similar solution but it dont work like seem... Try to scroll in the item when its on the desc-bar and you will see an undsiderated scroll if the viewport cannot contains all items
Shudarshan Rai 👑 😊
I edited my code and, i hope, i removed the scrolling problem simply by changing the overflow-y on "activation"... Anyway, for some strange motive, it dont work on my old device (i refer to html/css and not js). Futhermore it has many other problems like window resizing... Suggestions are welcomed