I def need this as I have text and if the picture behind changes to white, people will not see my text.
Also, is there an optimal size for the photos for this action? I tried it and 1 picture was missing top part when seeing it in supersized background so maybe I have to adjust the size of the picts.
If you do the following, you can place an overlay on the screen that will stretch to fill the browser. Please follow all steps, exactly as written.
Click anywhere on the pasteboard, so nothing is selected on the page. Choose the HTML Box tool from the toolbar.
Draw an HTML box that doesn’t intersect any other element on your page (you may need to do this on the pasteboard depending on how crowded your page is). Set its Position picker to Fixed in Window.
While the HTML box is still selected (handles showing on sides and corners) click into the first position field of the Inspector (left). Enter a 0 (zero), then do the same with the top field.
Click on the icon to the left of the height and width fields (which will disable those measurements) and enter 0 in the bottom and right fields.
Select the second tab (style) in the Inspector, and open the Graphic Effects segment. Click the left-most icon (graphic background) and choose a color and opacity for the background.
You now have an HTML box that spans the entire visible screen at all times and covers it with a semi-transparent background. Any content that you nest within this box (HTML text, transparent PNG images, etc.) will appear at full opacity, only the background will be “ghosted”. This is a very popular art direction style when you have full-screen photographs and need to make small type “pop” enough to be readable.
If you want this box to only cover part of the screen, simply drag one of the sides to the desired dimension. For further styling, you can disable the top or bottom position (restoring the height dimension) and “pin” the panel to the top or bottom of the screen, leaving the rest un-covered.
Walter
On Jun 30, 2012, at 10:20 PM, Barry Hoffman wrote:
Hey Dave,
I fixed it
I had to set it to .png and colors to MILLIONS.
Is there an EASY way to have it stretch across entire screen all the time or no?
Having trouble getting the bar to now go all the way across horiz, but also MOVE Up when the person scrolls the page.
Right now, it is fixed at the top which helps see the text, but when the person scrolls the black bar is still there: I think I messed up with my settings. Here they are in inspector
Try changing it from Position: Fixed in Window to Position: Absolute (the default). Then it will scroll with the window.
Walter
On Jul 11, 2012, at 1:32 PM, Barry Hoffman wrote:
Walt,
Having trouble getting the bar to now go all the way across horiz, but also MOVE Up when the person scrolls the page.
Right now, it is fixed at the top which helps see the text, but when the person scrolls the black bar is still there: I think I messed up with my settings. Here they are in inspector
Set the width to indeterminate, then. Click on the left-right arrow icon left of the width field, which will gray out the width number. Then set the left and right both to 0, which will “stick” the bar to both sides of the screen. Note that this will only work in a page that does not have the Align value set to anything. The only way around that is to use the Fixed in Window positioning (which sticks in the page and does not scroll) if you want the bar to always be full-width. It’s a pick-one type situation, I’m afraid.
Walter
On Jul 11, 2012, at 1:51 PM, Barry Hoffman wrote:
Walt,
2 problems
your original directions led me to believe I should have gotten
FIXED
0 0
980 100
0 0
but this is not possible because when I change the bottom right one to zero, it changes the top right one to 7500.
your new suggestion of going to absolute does scroll but the bar then becomes only 980 across since that is what is set
i deleted it and all the work I put towards it because I thought it was just too messy of a look.
The love the idea of the BG, and the way it looks on other people’s site but on mine with all the icons and table of over 250 links it just was not a good match…