How to make a spry menu "fixed"
hey folks,
im redesigning my photography website, and the little technique i had in dreamweaver is rusty. i am going for a menu bar, across the top (with my name, and links to portfolio pages, contact info, etc.) to be visible at all times throughout the site. the body of the portfolio pages will be a horizontal scroll bar. the problem is that when i scroll to see the body, the spry menu scrolls away to the left with the rest. i just need a tip on either fixing the menu in one place despite what the rest of the page does, or if there is a better tool to use. perhaps just inserting the menu as an image and creating hot spots? or something like tables? i know there are several ways to get things done in programs like dreamweaver, just hoping for the one that loads best, looks best, and is easy to edit in the future. thanks!
Have a look here http://limpid.nl/lab/css/fixed/header-and-footer
Gramps
Similar Messages
-
How to make 1 spry menu for the entire site? but not on each page
i have a website that i wish to have multiple pages available all form the same menu and late and probably at regular intervals add more tabs to the menu
is there a way to create a spry menu speratley that the page some how references, something like a frameset but without using framesets?
im sort of new to webdesigning and unsure of the correct terminology, so i am finding it difficult to look up stuff that i don't know the name for, but will gladly go read someting if you point me in the right direction.
regards
for now
wayneYou can do this with PHP or ColdFusion
These are "server side" scripting languages so you will have to test your website after you upload to you web hosting account.
Or if you set up a local server. Without the local server you will get errors when you open them in firefox.
To use the following what you do is "Cut" the part you want to be on all pages out, "Paste" it into a seperate document and in its place on your page you put one of the following suitable tags.
You will also have to rename your main file to .php or .cfm as opposed to .html
Again, whatever page you put one of these tags on, their extention must change match the type of tag used.
First Method (PHP):
PHP is the more common method -
<?php @ require_once ("yourMenu.html"); ?>
Require_once is basically a safeguard so that you don't add the menu twice onto a page.
This will only work for PHP 4+
This method would work for older versions of php too -
<?php @ include("yourMenu.html"); ?>
Second Method (ColdFusion):
This will only work if your host has ColdFusion installled -
<cfinclude template="bla.html">
eg index.html
<html>
<head>
<title>Stuff</title>
<head>
<body>
<?php @ require_once("SpryMenu.html"); ?>
</body>
</html>
SpryMenu.html
<ul id="menubar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
<ul>
<li><a href="#">Item 1.1</a></li>
</ul> -
How do you make a Spry menu view on all pages but only have to change it one place?
How do you make a Spry menu view on all pages but only have to change it one place? Someone told me maybe I could create a Library item. Any help will be appreciated.
If your pages all have the same basic design, using a DW Template would be a way to do it...
http://help.adobe.com/en_US/dreamweaver/cs/using/WScbb6b82af5544594822510a94ae8d65-7abea.h tml -
Can you make a Spry Menu Bar a snippet?
Is there a way to make a Spry menu bar a snippet so you can
edit the snippet and have it updated on all pages?The include method is good, but make sure to use root
relative links in the menu so that if you place the menu on a page
in a sub folder of your site that the links will still point to the
correct place.
If you are using Dreamweaver, it may be possible to place the
menu into a non-editable region of a template and updates will be
made in all of the child page. Or you might be able to make it into
a Library item (again with root relative links), and then changes
to the library item will update throughout the site. With both of
these options, you'll need to upload the changed pages, so these
aren't as quick and easy as the include method that V1 Fusion
suggests.
If you edit the Library item and the include file, you'll see
in Dreamweaver that the menus are not styled, that's because the
file that you're editing does not have the CSS file(s) linked to
it. You should be able to add a Design Time style sheet ( IN CS3:
Text -> CSS Styles -> Design-time... ) to assist you in
seeing it like what it would look in Dreamweaver without the
library/include option. -
How to align the spry menu pannel in dreamweaver cs4
Can someone tell me how to align the spry menu pannel either left, center, are right in a div tag? I'm talking the whole pannel I have within a div tag.
ThanksDefaults to left align
To center ul.MenuBarHorizontal{margin: 0 auto; width: 32em;} addjusting the width to suit.
To align right ul.MenuBarHorizontal {float: right; width: 32em;} addjusting the width to suit. -
How do I make Vertical Spry Menu appear in IE
The URL in question is:
http://www.ambppct.org/index_menu.php
I have inserted a Vertcal Spry Menu on this page. It functions perfectly in Safari, Firefox and IE 8. However it does not appear in previous versions of IE.
Below is the css file:
@charset "UTF-8";
/* SpryMenuBarVertical.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
ul.MenuBarVertical
margin: 0em;
padding: 0em;
list-style-type: none;
font-size: 12px;
cursor: default;
width: 12em;
font-family: Verdana, Geneva, sans-serif;
color: #C03;
font-style: normal;
z-index: auto;
background-color: #CC9999;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
z-index: 1000;
width: 12em;
/* Menu item containers, position children relative to this container and are same fixed width as parent */
ul.MenuBarVertical li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 12em;
background-color: #CC9999;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
padding: 0;
list-style-type: none;
font-size: 100%;
position: absolute;
z-index: 1020;
cursor: default;
width: 12em;
left: -1000em;
top: 0;
margin-top: -5%;
margin-right: 0;
margin-bottom: 0;
margin-left: 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarVertical ul.MenuBarSubmenuVisible
left: 0;
width: 12em;
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
width: 12em;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
border: 1px solid #D6D6D6;
width: 12em;
/* Submenu containers have borders on all sides */
ul.MenuBarVertical ul
border: 1px solid #D6D6D6;
width: 12em;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarVertical a
display: block;
cursor: pointer;
background-color: #CC9999;
color: #C03;
text-decoration: none;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
font-style: normal;
border: thin solid #D6D6D6;
overflow: hidden;
padding-top: 0.5em;
padding-right: 0.75em;
padding-bottom: 0.5em;
padding-left: 0.75em;
width: auto;
position: relative;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
background-color: #CC6666;
color: #FFF;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
background-color: #C66;
color: #FFF;
width: auto;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
width: auto;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
width: auto;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarVertical li.MenuBarItemIE
display: inline;
f\loat: none;You will have to update your spry code (do not know how (possibly in editing the css), but it is causing the problem).
If you have CS3 or 4, you can use the spry updater extension from -
http://labs.adobe.com/technologies/spry/
Delete your old spry files then apply the spry updater by selecting, Site - Spry Updater - then select the options req'd.
Check your page works, modify the spry css as required, checking the site in the browsers after every change.
PZ -
How do I keep the Spry menu fixed to the bottom of the header div?
I have created a horizontal Spry menu bar using Dreamweaver CS4 but the problem is, I can't figure out how to make it be in the right position at the bottom of the header div. In Design View it is too far below the header background graphic, in Live View it cuts off the bottom of the header graphic, and it also looks higher or lower in Safari and Firefox.
I'm sure it's very simple, but how can I control them menu on the y-axis and keep the menu fixed to the bottom of the header div? Is there a way to float it to the bottom?
I really appreciate any help or advice anyone can give me on how to get a stationary menu bar.Below is an example of a fixed-header & footer layout with jQuery smooth scrolling. I did not use a separate scrolling div because mobile users have lots of trouble with them.
View source to see the code.
http://alt-web.com/TEMPLATES/FixedLayout.shtml
You need 4 basic things:
jQuery latest core library,
jQuery easing.js,
jQuery anchor.js, inside the <head> of your document
jQuery function code, near the bottom of your document.
That's all there is to it.
Nancy O. -
How do I make a Spry menu work on an iPod?
Hi there,
As the Spry menu will only appear on hover, it is not accessible on an iPod/iPhone - is there anyway to make them work differently so that when you touch them on the iPod screen, the drop down menu appears instead of taking you to a new page?
Many thanks,
StevenThe Spry 2.0 menu bar is optimized for mobile and accessibility. You can find more info about Spry UI at the Spry Site http://labs.adobe.com/technologies/spry/ui/
I hope this helps.
Ben -
How to use a Spry Menu as a Library item?
Okay, this is my second post; but, with a different title.
I made a Spry menu for my Home Page. I saved it and a logo
together as a library item and placed the library item on a second
page. The links in the menu work when there is no style sheet
attached for the Spry meny and the menu appears just as text; but,
as soon as the .css style sheet for the menu is attached to the
second page, the menu appears correct except the drop down menus do
not work. I tried adding a link to the Spry Java Script file as it
is on the home page; still no luck.
I tried the same with a test file, which I have since
removed, stored at the same folder as the home page; same problem.
How are we suposed to make a workable library item with a
Spry Menu? Surely this is possible, no?
Here are the two pages I am referring to:
Good Page:
http://iculver.com/
Bad Page:
http://iculver.com/pages/AboutUs/Personal_info.htmlApologies - my mistake. You are correct, and my instructions
were
incomplete. That other bit is required too.
> Now, I thought (probably in error) that items after !--
were comments, but
> it
> seems to be required, too. I tried eliminating taht part
and the menus did
> not
> work. I need all of this last part.
The comments 'hide' the scripting from validators and older
browsers, but
it's still recognized as javascript, since the comments occur
INSIDE a
<script> tag.
> these Spry Menus in Libraries easier to use...)
It's not so hard once you get all the pieces together.
1. Create the library item as described.
2. Make sure that each page that is to carry this library
item has the
required links in the head (to the CSS and the js files), AND
in the body.
Why not use a template instead? That way, all of these links
are managed
for you.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"JustBob" <[email protected]> wrote in
message
news:[email protected]...
> Hummm...
>
> Now, don't yell at me, okay? I'm a goLive switcher and
really a graphic
> designer, not a coder...
>
> So, It seems from the above message that I am to
establish the links to
> the
> script and the css file before inserting the library
item. But, either
> way,
> that didn;t do the trick for me. I did find a bit of
code in one of the
> pages
> that seems to be required.
>
> It seems I also need to insert this just before the
close of the body tag:
>
> <script type="text/javascript">
> <!--
> var MenuBar1 = new Spry.Widget.MenuBar("MenuBar",
> {imgDown:"SpryAssets/SpryMenuBarDownHover.gif",
> imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
> //-->
> </script>
>
> Now, I thought (probably in error) that items after !--
were comments, but
> it
> seems to be required, too. I tried eliminating taht part
and the menus did
> not
> work. I need all of this last part.
>
> I'm sorry I'm such a dope. I probably did something
funny when I was
> styling
> the menu. (I do hope Adobe can accommodate dopes lime
me, though, and make
> these Spry Menus in Libraries easier to use...)
>
> Thanks for all of your help! Really!
> -
How to make a good menu!!!
Hi!!!
How can I make a good menu that it executes at runtime? Also this menu has to read a .txt file, which has the user permissions to display the menu according the connect user.
I try to do with javascript, but I don't know to read a file.txt with javascript and to give the parameters to the .java of the page.I have read a lot of manuals of studio creator and javascript and I don't read anything to do this.
I also see that some people do these menus in jsp, but the studio creators jsp code view is in XML, and the tutorial and examples of jsp are in pure jsp with html, so I can't use in studio creator.
ThankssssI've read about the destruction due to sweat and have been careful where I put the iPod. I'm in the humid deep south, so I have a real concern.
I took it out on a run during a rainstorm on Jan 1, but didn't use the earphones. It only came along so it could record Nike+ data, and it was inside a baggie so it had a better chance of staying dry. It did fine.
My concerns are keeping moisture out of the data port and the headphone jack. Since I've got the Nike+ dongle, it's more difficult for moisture to get in there.
I've only had it in mild weather, minus rain. If it's fair weather, it clips to the front of my shorts off to the side, where I've seen that I tend not to drench my shirt with sweat. I thought of using a wrist strap, but there's been too many times where I've had sweat dripping off my wrists/palms.
Of course, this is way off topic, but I thought I'd give you my opinion. -
How to keep a Spry menu in one file?
Could somebody explain me how I can keep the HTML code for a
Spry menu (horizontal) bar in just one file? Of course, the aim is
to reduce the effort of making later changes in the menu to a
minimum... I'm not a professionell developer, but I wonder if I can
do so by using PHP or maybe XML. The question is: How do I do this?
Thanks for any help!http://www.tizag.com/phpT/include.php
Pablo
www.paul-dell.com
"Death is no more than passing from one room into another.
But there's a
difference
for me, you know. Because in this room I know I can have a
beer."
"bjjobe" <[email protected]> wrote in
message
news:fvelgb$idr$[email protected]..
> Could somebody explain me how I can keep the HTML code
for a Spry menu
> (horizontal) bar in just one file? Of course, the aim is
to reduce the
> effort
> of making later changes in the menu to a minimum... I'm
not a
> professionell
> developer, but I wonder if I can do so by using PHP or
maybe XML. The
> cquestion is: How do I do this?
>
> Thanks for any help!
>
> -
How to edit existing Spry Menu?
I created a Spry Menu, but now that it's published (saved) I
don't see how to edit it so I can easily add more menu items using
DW's visual tool. All I can get to is the menu's CSS.
How do I edit an existing Spry Menu to add/remove more items?
I'm using CS3.I guess I dont understand. You can add or remove or change
the menu in the
properties panel. You can do all that in the design view as
well, so I'm
not sure what I am missing.
Is the page available to view?
"morkafur" <[email protected]> wrote in
message
news:goja98$mho$[email protected]..
>I guess I'm not being clear. Sorry.
>
> What I'm saying is that when I click "anywhere in the
menu" or the border
> around it, I don't get the display where I can click the
"+" to add a menu
> item.
>
> For example, I have a menu item called "Capabilities".
If I click that
> menu
> item I see properties for it, no problem. I get this.
>
> What I'm trying to do, however, is get back the the Spry
menu item
> DESIGNER
> where I can add/remove menu items graphically.
>
> Regardless of where I click, that designer does not
re-appear.
>
> If I click the Spry menu item on the toolbar, CS3
creates a new menu, but
> doesn't let me edit (using the menu designer) the
existing one.
>
> -- M
> -
How to make a sidebar menu with subsection?
Hello
I've been trying to make a sidebar menu with subsections you can expand and collapse both in muse and edge animate but I just can't. I've search the net for tutorials for two weeks now, it's like such a menu just doesn't exist even tho I've seen them on several sites.
Thos is a picture of how I want it to look:
As a default, you can only see "home" and the two "subject". Then when you click on the first "subject", the two "tutorials" expand down, when you click on the individual "tutorials" the parts of that tutorial expands down. When you click on the buttons that expand subsection again, they collapse.
As I've said I've search for tutorials for weeks, the person I'm making the website with has also search without any luck at all. I've found a tutorial that lets me have 1 button with subsection expanding when mouse is over it, but nothing where there are buttons below the button you expand. I'm starting to thing it's just impossible, but I can't understand how it should be impossible. In case it actually is possible I need to re-thing the way I organise and navigate the entire site.
There is gonna be a whole lot of content on the site, we expect it to grow with up to 100 pages a month, therefor the navigation is obviously very important.
I really hope someone can help me! A link to a tutorial I haven't been able to find or a description on how to do it, thanks!Hi,
I am relatively new to Muse and hardly an expert, but I just did what you are describing. Go to the Widget Library, Compositions > Blank. In the Target, insert a Vertical Menu (also in the Widgets Library). In the Options menu, under Menu Type select All Pages. If that doesn't work the way you want it to, you might have to select the Manual menu option.
Here's a short tutorial on how to use the Compositions Widget:
Adobe Muse Mega Menu Dropdown Widget | MuseThemes.com
Other tutorials that may help:
http://terrywhite.com/how-to-create-a-dynamic-sliding-menu-for-your-mobile-website-in-adob e-muse/
How To Create A Sliding Menu for Your Mobile Website in Adobe Muse - YouTube
You might also look at Panels > Accordion. You can insert your menu into the Accordion Target.
Hope this helps.
John -
How to make a sidebar menu with drop down submenus
I would like to make a sidebar menus as shown below. When you first get the menu only the home and subject button are shown, as you click on a subject you get the different tutorials and as you click each tutorials you are shown the parts. If you are on one a part page you will still have that part shown in the menu but if you click on it in the menu the it's collapsed again. I can't find anything about how to do this.
Hi,
I am relatively new to Muse and hardly an expert, but I just did what you are describing. Go to the Widget Library, Compositions > Blank. In the Target, insert a Vertical Menu (also in the Widgets Library). In the Options menu, under Menu Type select All Pages. If that doesn't work the way you want it to, you might have to select the Manual menu option.
Here's a short tutorial on how to use the Compositions Widget:
Adobe Muse Mega Menu Dropdown Widget | MuseThemes.com
Other tutorials that may help:
http://terrywhite.com/how-to-create-a-dynamic-sliding-menu-for-your-mobile-website-in-adob e-muse/
How To Create A Sliding Menu for Your Mobile Website in Adobe Muse - YouTube
You might also look at Panels > Accordion. You can insert your menu into the Accordion Target.
Hope this helps.
John -
How to make a game menu..
How do you go abouts on making a game menu???
I Know how to make a button with gotoAndStop, and gotoAndplay. I understand timeline coding. And have started with classes and OOP, im ok at writing classes i guess.
But I have know idea how to make a menu that has basic things like instructions start ect basic things.. I have a library with a exported SWC, so i presume i need to grab my graphical assets from this, correct? or is there other ways?Thank you for this i have stumbled upon this before.
Now really the real question is how do i add my game to that? I have a Main class attached to my game currently.. With a FLA holding graphics (I know i can add my buttons to this fla.) Thats the problem my game is currently the documents class. So if i change it to the main provided by emmanuel. that communicates with the the_game_itself.as, but im unsure as to how im supposed to put my code in this and still communicate with the main document class?
If you want to see my code, let me know.
Maybe you are looking for
-
What is included in the new download
In the download section I found: SAP NetWeaver Enterprise Portal on MaxDB, Developer Edition Sneak Preview - Content Management and Collaboration SP9 and TREX What is meant by Collaboration ? Is XI included ? What is TREX ? Best regards Thomas Madsen
-
How can I migrate data from SQL Server 6,5 to Oracle 8?
We have a web site based on Microsoft SQL Server 6.5.Now we plan to migrate the database to Oracle 8. We have redesigned the tables structure and created tables under Oracle 8, so we only need to migrate data from SQL Server. We've exported data from
-
Hi, I am testing Apex with BI Publisher and want to print a region and include the App. Logo in the printed Page how can I do this? MDK. Edited by: MDK on Apr 21, 2010 4:54 PM
-
Hi all, In pivot function "in" clause i want to use sql query, because i want to take values dynamically from the table. How can i use, is there any solution for that. Pls help me. mani
-
DNG converter 6.4 and DNG codec 1.1 for Win7 32 & 64bits released!
The DNG converter 6.4 has been released, http://www.adobe.com/products/dng/ with support for many new cameras, including: Canon EOS 600D (Rebel T3i / Kiss X5 Digital) Canon EOS 1100D (Rebel T3 / Kiss X50 Digital) Fuji FinePix S200 EXR Fuji FinePix F