Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Client-side Scripting _ JS Timeline Website - Chasing an elegant fix, and a mouse scroll solution

Posted by: Toldorn Apr 14 2021, 11:46 PM

Let me start by first apologizing if this has been posted in the wrong forum. This website is using CSS and JS – but I’m unsure which is the best home to post this question as I’m not entirely sure what is causing my issue – although I suspect it may be the JS, hence why I posted it here.

Hello!

I'm chasing two elegant solutions to a problem I'm having with a timeline website ; https://tropicalexposure.com.au/timeline/index/

[ files available to download here : https://tropicalexposure.com.au/timeline/timeline.zip ]



Problem 1 --- The Menu on the left doesn't scale to the available space (and goes behind the < > buttons ). My final 'timeline' will have about 30 items that will need to be displayed. So a having a mouse wheel scrollable solution would be amazing. I've mocked up a quick example of what an ideal outcome would be here ; https://ibb.co/X8nNtfY

Downloading the files (link above) will show you all of the JS and CSS that's being used on the website - and I'm happy to paypal some funds if this is going to be a lengthy time-consuming fix!

Problem 2 --- I'd love to have the users be able to scroll down the web page with their mouse - rather than being FORCED to click the menus on the left. As they scroll down, the menu would need to be reflected on the left hand side too if possible.


Is anyone out there clever enough to help me ? Shoot me a PM or email to david@tropicalexposure.com.au if you can help me figure this out or come up with an elegant workable solution for one or both of these problems!

Posted by: pandy Apr 15 2021, 06:36 AM


QUOTE
Problem 1 --- The Menu on the left doesn't scale to the available space (and goes behind the < > buttons ). My final 'timeline' will have about 30 items that will need to be displayed. So a having a mouse wheel scrollable solution would be amazing. I've mocked up a quick example of what an ideal outcome would be here ; https://ibb.co/X8nNtfY


That will always happen if the window height is too low since you've disabled scrolling. The alternative is to cut it off with overflow: hidden. Not good either. This can't work without allowing scrolling somewhere.

Posted by: Toldorn Apr 15 2021, 08:04 AM

I'm very happy to enable scrolling. (See problem 2).

I'm not sure how to re-enable it tbh.

Posted by: pandy Apr 15 2021, 11:59 AM

Is it a ready-made layout?

I'll see if I can find it. But there will be more too it.

BTW, nothing but the background display in older gecko (FireFox).

Posted by: pandy Apr 15 2021, 12:04 PM

Oops! Sorry. There's a lot of jQuery. Don't do that.

Posted by: Toldorn Apr 15 2021, 04:06 PM

Is there a better way of achieving the results I'm after?

Like I said, happy to pay for someone's time to get this fixed and in good working order!

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)