How can I anchor a video to the lower right corner of a browser window while the page scrolls? Here is an example, but the source code is encrypted so I can’t figure it out from there. Appreciate any suggestions!
Try just setting the Position picker in the Inspector to Fixed in Window. As long as your video is on a layer element, that option will be available to you, and it will stick the video in place relative to the page. You can stick the video to the right side of the page by clicking on the left offset icon in the inspector so it becomes disabled, which should then enable the right offset field. Type a 0 in there, and you will have a box that sticks to the edge of the browser window on the right.
Walter
On Mar 19, 2012, at 1:07 PM, madcomposter wrote:
How can I anchor a video to the lower right corner of a browser window while the page scrolls? Here is an example, but the source code is encrypted so I can’t figure it out from there. Appreciate any suggestions!
Thanks to both repliers, but I want to position the video relative to the corner of the browser window, not the page. Fixed in Window works as far as keeping the video in one place while the rest of the page scrolls, but it isn’t “stuck” in the corner of the browser. I’ll try the Sticker Action and report back. Many thanks!
I want to position the video relative to the corner of the browser window, not the page. Fixed in Window works as far as keeping the video in one place while the rest of the page scrolls, but it isn’t “stuck” in the corner of the browser.
Thanks, but that isn’t it. First, the Inspector does not show me the “combine with children” option. Second, the dimension settings anchor the video to the lower right corner of the PAGE, meaning you have to scroll down a 3000px-long page to see it. I need to anchor it to the lower right corner of the BROWSER WINDOW and let the page scroll by it while the video stays in that corner. Please see the example:
Fixed in Window is just that – relative to the browser window, not the page. What you are describing is how Freeway positions most layered elements – Absolute Positioning. Please follow these steps, just tried them and can confirm that it works precisely the way you seem (to me) to be describing this.
Make a really tall page, and place enough content on it to force a scrollbar in your browser. It doesn’t matter what this is, could just be a single colored box at the bottom of the page in Freeway.
Scroll to the bottom of the page in the design view, and draw an HTML box in the bottom-right corner of the page. Import a movie into this box.
In the Inspector, make the following changes: change Position to Fixed in Window, click on the ->| icon in the bottom left of the first tab, and also click on the icon in the bottom right (can’t make a nice ascii-gram of that one, sorry). What should happen is that the top-left and top-right position fields should be grayed out, and the object will be positioned relative to its bottom-left corner.
Preview in a browser. Even though Freeway’s design view conflates the idea of page and browser window in a confusing manner, you should see what you want to see, no matter what (modern) browser you use for this test. Resize your browser window, scroll the page, nothing should shake the movie from its position in the bottom-right corner of the browser window.
What’s throwing you off, I think, is that you are thinking that the fixed in window object will be placed relative to the page because you need to draw it at the bottom right of the design page in order to have it stick to the browser window. When the page is viewed in a browser, the separation is apparent and visible.
Walter
On Mar 20, 2012, at 9:21 AM, madcomposter wrote:
Thanks, but that isn’t it. First, the Inspector does not show me the “combine with children” option. Second, the dimension settings anchor the video to the lower right corner of the PAGE, meaning you have to scroll down a 3000px-long page to see it. I need to anchor it to the lower right corner of the BROWSER WINDOW and let the page scroll by it while the video stays in that corner. Please see the example:
Thanks, Walter, but it just isn’t working. If you scroll all the way down to where it says “here is some text at the bottom” you will see a black bar coming up from the bottom of the screen toward the left of the white block. That is the video (which will autoplay). I have it placed at 0px/0px, but that’s not where it’s showing up. It is also placed on the topmost layer.
Although your special theme is at minute 15+, I recommend to take time to watch the entire video.
Tipp:
There is an element “footer-playground”. I set this to center, but if you set this to float: right, clear right, it’s on the bottom right fixed (I tested it so I know it works).
Now it is working, thank you very much. The issue was that in the matrix of 6 dimension options, the top left and top right options were not grayed out. It’s perfect now. I really appreciate the time and effort you took to answer my question!