How to stop an element in Muse from scrolling in one page parallax?

[Uncle Flamin]

HI guys,

I am building a website which i would like to have a fixed column on lhs containing vertical state buttons that control the one page parallax (scrolling to pre determined spots on the page).

I would like the buttons on lhs to be sticky, so i have placed them on top of a rectangle box and then grouped them together.

how do i make this rectangular box containing the buttons sticky so it doesnt scroll with the one page parallax?

[Uncle Flamin]

for example, i can get the lhs colum to be sticky by creating a rectangular box and setting the motion for the box to "0" in all directions. However, if i do that, then i cannot use fluid width page properties...and thus i lose the ability of the lhs box to be at left hand edge of users browser window.

so im stuck.

[fotoroeder]

Yes, that's exactly the point. You either have to pin it, which could help with "no scroll" function but is not recommended on mobiles - or you use fixed with breakpoints. Not seeing your design I mostly recommend to use fixed width anyway because - also from not seeing your design -  mostly fluid width is not necessary for design reasons - just my opinion.

Kind Regards,

Uwe

[Nancy OShea]

@Uncle Flamin,

Before you board this leaky boat, I hope you understand the consequences of using End of Life software to build a website.  Muse has not been supported or updated since 2018 when Adobe discontinued it.  Meanwhile, the web and devices people use on the web keep changing.  Can you cope with a site that doesn't perform well for everyone?  Is there some other web authoring solution you can instead of Muse? 

If you need recommendations, I'll post some Muse alternatives below this reply.

[Nancy OShea]

CODE EDITORS:
-- Adobe Dreamweaver CC - https://www.adobe.com/products/dreamweaver.html
-- Atom (free) - https://atom.io/
-- Codespaces (free, browser-based) - https://github.com/features/codespaces
-- Nova (Mac only, formerly called Coda) - https://nova.app/
-- Pinegrow - https://pinegrow.com/
-- Sublime Text - http://www.sublimetext.com/
-- Visual Studio Code (free) - https://code.visualstudio.com/
-- Wappler ~ Visual Web App Builder - https://wappler.io/

============
ONLINE SITE BUILDERS:
-- Adobe Behance (free) - https://help.behance.net/hc/en-us/articles/204483894-Guide-Intro-to-Behance
-- Adobe Portfolio (free with a paid Creative Cloud Plan) - https://portfolio.adobe.com/
-- Squarespace - https://www.squarespace.com/
-- Webflow - https://webflow.com
-- Without Code - https://www.wocode.com/
-- Wix - https://www.wix.com/
-- WordPress (open source) - https://wordpress.org/

Hope that helps.

[Uncle Flamin]

I usually build website using Wordpress + Avada (theme framework/Fusion site Builder).

however, I am getting into using Dreamweaver for site builds. 

Trouble is, when starting from scratch, Dreaweaver is a slow process...its a shame adobe cant build Muse building funcitonality into DW...that would be awesome.

I built a website using Muse a few years ago and i really like the program...Im just not an advanced Muse user.

If i were to elaborate a little more, I created 2 breakpoints at website page width (fluid width at 1200px and Fixed at 1250px). This resolves the issue except it then presents a new one...

as soon as i bring in browser width to 1200px, my responsive background screws up as does a fixed vertical menu i have created on lhs of 1 page parallax...this menu starts scrolling too (i dont want it to do that)

[Nancy OShea]

Trouble is, when starting from scratch, Dreaweaver is a slow process...

==========

@Uncle Flamin,

No it's not.  Use one of the built-in Bootstrap Starter Templates.  Almost all WordPress Themes are built on Bootstrap for a reason.  Bootstrap's mobile-first framework takes care of all the breakpoints for you. 

Quick Start:

1. Define your Dreamweaver local site folder.  Site > New Site....  example C:\myTestSite\

2. Go to File > New > Starter Templates > Bootstrap Templates.  Pick one.  Hit the Create button.

3. SaveAs index.html.

4. Add content. Save.

5. Preview in browser (F12).

Dreamweaver User-to-User Community:

https://community.adobe.com/t5/dreamweaver/bd-p/dreamweaver?page=1&sort=latest_replies&filter=all

Bootstrap Documentation:

https://www.w3schools.com/bootstrap4/

https://getbootstrap.com/docs/4.6/getting-started/introduction/

Bootstrap Examples & Themes:

https://getbootstrap.com/docs/4.6/examples/

https://bootswatch.com/

https://themes.getbootstrap.com/

https://www.bootstrapdash.com/single-page-parallax-bootstrap-templates/

[Saanvi27961339jela]

I would also suggest checking the ready-to-use Bootstrap Dashboard Templates

[fotoroeder]

Your setup is at least missing the minimum width of 320 at first. Muse is able to set the scrollmotion different for its breakpoints. So this might be one case but I am terrified by the way you setup your breakpoints.

It was recommended with muse to go with 1200 - 960 - 768 - minimum width 320. It can get wider of though.

I am afraid to go with just fluid from 1200 to 320 will not work properly for design reasons. It may work technically, though. At this point  I also have to highly recommend to use another web building app. I am not aware of Dw at all, I must admit but if you are not tech savy … btw, are you on Mac or PC?

Kind Regards,

Uwe

[Uncle Flamin]

what do you mean terrified by how i setup my breakpoints? 

Are you saying that the 1250px breakpoint just outside the 1200px fluid breakpoint is a bad idea? Because that was recommended as the way to achieve this by Dani Beaumont (one of the official Adobe website Muse tutorial presenters)

[fotoroeder]

I got terrified because missing breakpoints and by your choice to use 1200 and 1250. What interesting is happening between this two breakpoints? I was not wondering about the breakpoint and its value in common but the way you set them up. And you'll need a minimum width, which is common sense to be 320 - there are no known smaller devices. For the lack of breakpoints, a menu - a text -  an image might appear different on different screens. I am not sure if your fluid width breakpoint can handle this properly so it "looks" good. Technically it might scale proportionally correct but might be too small on mobiles, does this help? Although this is not really necessary anymore, I still try to keep in kind of values, I mentioned in my previous post: 1200-960-768-minimum width-320. This also helps me, bacause the height is also quite good to keep in mind, even most pages are scrolled down anyway.

Still asking PC or Mac?

Kind Regards,

Uwe