Rollover cursor in IE7?

Hi - have created a nav bar using MM drop downs - they work
fine - other than some of them only show a rollover icon at the
very edge of the box - it shows the I beam text insertion cursor
instead. This only happens in IE7 - they're fine in Firefox...
Can anyone tell me why this happens and how to stop it?
http://www.holmes.7host.com/hills_beta/index.php

> Can anyone tell me why this happens and how to stop it?
It happens because the MM drop downs are working fine. The
way to stop it
is to not use the MM drop downs. Please read this, written by
the person
who adapted that code for Macromedia -
http://www.losingfight.com/blog/2006/08/11/the-sordid-tale-of-mm_menufw_menujs/
There are just much better ways of doing these menus -
Check the uberlink and MacFly tutorials at PVII -
http://www.projectseven.com/
and the Navbar tutorial/articles at Thierry's place
http://tjkdesign.com/articles/dropdown/
Or this one (more recent article):
http://tjkdesign.com/articles/Pure_CSS_Dropdown_Menus.asp
Or to get it done fast, go here -
http://www.projectseven.com/tutorials/navigation/auto_hide/index.htm
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
==================
"jimbly" <[email protected]> wrote in
message
news:eutv4r$1hh$[email protected]..
> Hi - have created a nav bar using MM drop downs - they
work fine - other
> than
> some of them only show a rollover icon at the very edge
of the box - it
> shows
> the I beam text insertion cursor instead. This only
happens in IE7 -
> they're
> fine in Firefox...
>
> Can anyone tell me why this happens and how to stop it?
>
>
http://www.holmes.7host.com/hills_beta/index.php
>
>

Similar Messages

Rollover problem with IE7

http://www.mawson.com/street/courses.html
The link above is my test page I'm working on. My rollovers
are workin fine in IE6 and FireFox. It figures that with the new MS
browser stuff stops working.
The problem is that the rollovers seem very fussy. For
example: I have rollovers on Courses & RiderCoaches. If you go
to Couses the rollover show up, but when you move the mouse over to
select the rollover it disapears. Can anyone help.
I'm using CSS:
http://www.mawson.com/street/main.css
And javascript
http://www.mawson.com/street/drop_down.js

Any help would be great

Custom Cursors with rollovers.

So I know how to make a custom Cursor in flash Pro CS5 but if I want that custom cursor to change to something else of my own design when it's over specific objects how would I go about doing that?

So here's the code for both both buttons and their rollover actions. Like I said it works fine for one but not the other. The forward button is fine, but when the back button is clicked it leaves behind a stamp of the rollover cursor.
/* Mouse Over Event
Mousing over the symbol instance executes a function in which you can add your own custom code.
Instructions:
1. Add your custom code on a new line after the line that says "// Start your custom code" below.
   The code will execute when the symbol instance is moused over.
backbtn.addEventListener(MouseEvent.MOUSE_OVER, fl_MouseOverHandler_2);
function fl_MouseOverHandler_2(event:MouseEvent):void
parent.addChild(backphoto);
backphoto.addEventListener(Event.ENTER_FRAME, fl_CustomMouseCursor_2);
function fl_CustomMouseCursor_2(event:Event)
          backphoto.x = stage.mouseX;
          backphoto.y = stage.mouseY;
Mouse.hide();
/* Mouse Out Event
Mousing out of the symbol instance executes a function in which you can add your own custom code.
Instructions:
1. Add your custom code on a new line after the line that says "// Start your custom code" below.
   The code will execute when the symbol instance is moused out of.
backbtn.addEventListener(MouseEvent.MOUSE_OUT, fl_MouseOutHandler_2);
function fl_MouseOutHandler_2(event:MouseEvent):void
parent.removeChild(backphoto);
Mouse.show();
/* Mouse Over Event
Mousing over the symbol instance executes a function in which you can add your own custom code.
Instructions:
1. Add your custom code on a new line after the line that says "// Start your custom code" below.
   The code will execute when the symbol instance is moused over.
Forwardbtn.addEventListener(MouseEvent.MOUSE_OVER, fl_MouseOverHandler);
function fl_MouseOverHandler(event:MouseEvent):void
{stage.addChild(nextphoto);
nextphoto.mouseEnabled = false;
nextphoto.addEventListener(Event.ENTER_FRAME, fl_CustomMouseCursor);
function fl_CustomMouseCursor(event:Event)
          nextphoto.x = stage.mouseX;
          nextphoto.y = stage.mouseY;
Mouse.hide();
/* Mouse Out Event
Mousing out of the symbol instance executes a function in which you can add your own custom code.
Instructions:
1. Add your custom code on a new line after the line that says "// Start your custom code" below.
   The code will execute when the symbol instance is moused out of.
Forwardbtn.addEventListener(MouseEvent.MOUSE_OUT, fl_MouseOutHandler);
function fl_MouseOutHandler(event:MouseEvent):void
stage.removeChild(nextphoto);
Mouse.show();

IE Rollover Problem in Frame

I would appreciate assistance in resolving a rollover problem
which exists only in all versions of IE but works fine in FF,
Opera, Safari, and Chrome. You can see the page at
http://www.moriel.org/Moriel_USA/Moriel_USA.html.
This is a frameset where the rollover menu in the left
sidebar automatically loads the page in the main section to the
right. In IE it loads the rollover on the wrong line (1 below where
it should be) but still correctly loads the page on the right.
I'm sure I'm not the first to experience this but just can't
seem to locate the solution. Any help would be much appreciated.
Thanks!

Pardon me for saying this but that is simply an awful way to
make a website.
It suffers from all of the usual disadvantages of frames
(there is no reason
at all for using them here), in addition to the fact that
each rollover
required an entirely new page to load in the central frame
(i.e., long -
LONG - delay).
In addition, your use of Java on one of the pages ensures
that a great many
of your visitors will not see the contents there. That,
combined with your
use of an all javascript menu in the top navigation frame -
<script type="text/javascript" language="JavaScript1.2"
src="../Scripts/MainNav.js"></script>
means that your site won't be spidered at all. Sorry - but I
think your
site layout architecture defeats the very purpose of the
site.
I don't see any rollover problem in IE7.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"NoHandleBars" <[email protected]> wrote in
message
news:gjirk2$hjp$[email protected]..
>I would appreciate assistance in resolving a rollover
problem which exists
>only
> in all versions of IE but works fine in FF, Opera,
Safari, and Chrome. You
> can
> see the page at
http://www.moriel.org/Moriel_USA/Moriel_USA.html.
>
> This is a frameset where the rollover menu in the left
sidebar
> automatically
> loads the page in the main section to the right. In IE
it loads the
> rollover on
> the wrong line (1 below where it should be) but still
correctly loads the
> page
> on the right.
>
> I'm sure I'm not the first to experience this but just
can't seem to
> locate
> the solution. Any help would be much appreciated.
Thanks!
>

Project Freezes on Mac

Thanks to everyone who posted an answer about making files invisible. I appreciate the help. I have one more challenge. I have created a project that calls for .mov files (among other things) to run within it. Everything works great on PCs, but on MACs, there is a specific sequence of 3 buttons that end users can push that makes the program freeze, leaving the following .mov file on the screen and none of the buttons working.
The problem starts when people call up an .mov file using a certain button on the screen, and then press 2 other buttons in a specific sequence. The first of these buttons just takes the user to another activity and the second of these 2 buttons calls up a different .mov file. Once the second .mov file is called, the program will play the video and then freeze. It does not matter which .mov files are called up (several choices), the problem is the same. Any other sequence of buttons following viewing the original .mov file causes no problems. I cannot find the lingo error causing this, and the program runs perfectly on PCs. If you are interested in looking at a puzzling challenge, would you let me know and I will send you the .dir and related files? I feel like I am staring at a simple solution and just can't see it.

Hi Sandra,
Not on a Mac today so can’t test the steps and see the problem directly. However, will offer some suggestions.
It sounds like the video is just staying on screen rather than actually crashing your application. Can you test this by the change I mentioned before. Instead of making the video sprite invisible, can you move it off stage as I suggested as follows
Replace
set the movieRate of sprite 44 to 0
with
sprite(44).locH = sprite(44).locH + 8000
or verbose syntax if you prefer
the locH of sprite 44 = (the locH of sprite 44) + 800
Next, Sean’s suggestion is a good one. Where idd you add the statement he suggested? I would suggest you add the following to your frame behaviors in the frame following on from a video
on enterFrame
the stageColor = the stageColor
end
Other things to improve your code. A behavior like:
on exitFrame
go to the frame
    if the movieRate of sprite 44 = 0 then
    set the memberNum of sprite 46 to the number of member "play_up"
else
    set the memberNum of sprite 46 to the number of member "pause_up"
end if
end
could be improved in a number of ways.
1. If you are including code that is making adjustments to sprites, have that before the ‘go to the frame’ line.
2. memberNum is dated Lingo instead just use ‘member’:
sprite(46).member = member(“play_up”)
or verbose
the member of sprite 46 = member("play_up")
3. I’m not sure why the change of members is in the frame behaviour. It could be linked to any button that takes you out of the video sequence. So, you may have a behaviour as follows:
-- pause video and change buttons
on mouseUp
sprit(44).movieRate = 0
sprite(46).member = member(“play_up”)
end
You could have a separate behaviour that starts the video. It could be attached to the video sprite and could be:
-- play video at start
on beginSprite
sprit(44).movieRate = 1
sprite(46).member = member(“pause_up”)
end
I suggest you try separate different elements of behaviors. For the ‘Return to Error Choices’ script, you have code to switch cast members (highlight the sprite on rollover) as well as the mouseup instructions. I’d suggest you use the ‘Rollover Member Change’ behaviour in the Behavior Library – Animation > Interactive category. That will mean the same behavior can used for all sprites without having to hard code individual buttons. Will be much more efficient. I’d also suggest you add the ‘Rollover Cursor Change’ behaviour, also in Behavior Library – Animation > Interactive category. Remember, you can have multiple behaviors attached to a single sprite. So, having individual behaviors for different types of things, it makes your code management more efficient and will help in locating bugs too.
Last code suggestion – look at the use of case Lingo which be used over if then when appropriate. For example:
    if numberOfTries = 0 then
      go to "EC1"
    else if numberOfTries = 1 then
      go to "1E1"
    else if numberOfTries = 2 then
      go to "1E2"
    else if numberOfTries = 3 then
      go to "1E2"
    end if
Can be replaced with:
case numberOfTries of
    0: go to "EC1"
    1: go to "1E1"
    2: go to "1E2"
    3: go to "1E2"
end case
In the above example, besides being more efficient to write, it’s also more efficient to execute.
Has been longish reply. Hope it's been helpful.
Dean

RollOver/MouseOver cursor change bug in external loaded swf

I have a master movie with navigation that loads a external swfs. The external swfs serve different purposes and typically have a series of buttons that navigate the timeline. The external movies with their buttons work fine running individually. When the movies are loaded through the master movie, the buttons in the external movies looses the cursor change on rollOver. These are basic invisible hotspot - button symbols. The buttons typically navigated to different frames. I am curious why the cursor change fails when loaded through the main movie, but works when run on its own.
I have done some searching in Google, but didn't find a similar issue. Any ideas? Throughout all the movies, I probably have over 200 buttons, I don't want to create rollOver and rollOut cursor changes for each. Again, these are basic button symbols.
Any clues?
Dave

Actually, the some of the external movies were created with InDesign - which is the worst application for developing Flash content with.

Rollover problem when page viewed in IE7

Has anyone else come across the same problem:
I have made a navigation bar that uses rollover images in
Fireworks.
The nav bar works fine when viewing the page in IE6 but when
viewed in IE7 the rollover image seems to try and shrink by one or
two pixels producing a squashed effect.
I have tested this on three different machines running IE7
and all of them produces the same problem, viewing the same nav bar
in IE6 is fine in all three.
Any advice would be appreciated.
cheers
Matt

Matrix16;
Can you provide an example url? Tom Unger

No Cursor Rollover Feedback

Hi there,
I'm having a pretty trivial problem but it's driving me CRAZY. So, normally when you rollover the dock/drop-down menus/etc. with the cursor, there's some sort of feedback. Whether it be highlighting or the name of the application showing up above the dock icon or whatever, there is always SOME sort of rollover feedback. Well, for some reason there is no feedback for me anymore. I rollover the dock and nothing shows up over the icons, I can still click on them just fine, but there's absolutely no indication besides my cursor being on the icon that I am rolling over. On drop-down menus there is no highlighting of the options when I roll-over, it just stays the same color. The cursor never changes either, it is always the black arrow whether I'm on a link or a button or not.
Any ideas on how I can fix this? I've tried restarting, by the way. It's probably one of the most unexplainably annoying things I've ever encountered with my Mac. It's just very offsetting, I want to fix it to save my sanity!
Thanks.
Message was edited by: kTulls

ok i got the solution! Its a mouse driver problem! Simply unplug an replug your mouse and you are fine.. i assume you use a logitech mouse with the logitech control center? I guess we have to wait for an updated Software.

I need to change my Cursor when I rollover the Image, Any feature is there in Muse...?

I need to change my Cursor when I rollover the Image, Any feature is there in Muse, I searched it, But no use, Is there's any plugin is there to do...?

Click here and request assistance.
(89404)

Detecting movie rollover without cursor changing

Hi there,
I want my flash movie to initiate a sequence of events when
the mouse strays inside a certain area. One way I've found to do
this is create a movie with a completely transparent rectangle
enclosing the 'sensitive' area (which I've given an instance name
of ActiveArea), and attaching a rollover behaviour like this:
ActiveArea.onRollOver = function () {
play();
This is fine, except that when the mouse moves over
ActiveArea the cursor changes to a hyperlink style cursor, which I
do NOT want!
Is there either a way I can stop the cursor changing, or
alternatively a completely different approach which solves this
problem?
Any help is gratefully received!
Luke

I just found another way of doing it(before seeing the
incredibly simple solution above) which seems to work... Is there
any advantage to either approach?
Here's my way:

FAQ: How do I make a hand cursor display on rollover or mouse over?

You can make a component in your application, for example a button or custom component, display a pointing finger cursor when a user's mouse rolls over it. Select the component, and in the Appearance section of the Properties panel, check Hand cursor.
Read the quick tip on FlashCats.

Hi there
Another approach is to use a Rollover Caption. Just remove any text and configure the caption as transparent. Then layer the Rollover area over the part where you want the hand to change to a cursor. The net effect will be that the cursor change will occur. Clicking will then result in triggering the underlying Submit button, which appers to be invisible and layered over an image.
Cheers... Rick
Helpful and Handy Links
Captivate Wish Form/Bug Reporting Form
Adobe Certified Captivate Training
SorcerStone Blog
Captivate eBooks

Changing cursor when rollover Jbutton

hi All...i need help
i want to change the cursor when i move my mouse over the button into hand cursor, then when the button being pressed, cursor change to Wait cursor
here code of mine..
import java.awt.Color;
import java.awt.Cursor;
import java.awt.GraphicsEnvironment;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
* @author tys
public class cursor_test extends JFrame{
    public cursor_test(){
        add_panel panel = new add_panel();
        add(panel);
        setBackground(Color.WHITE);
        setDefaultCloseOperation(EXIT_ON_CLOSE);
        //GraphicsEnvironment ge = GraphicsEnvironment.getLocalGraphicsEnvironment();
        setSize(200,200);
        setVisible(true);
        setTitle("Test cursor");
    public static void main(String[] args){
        new cursor_test();
    }//Main
}//end class frame
class add_panel extends JPanel{
    public add_panel(){
        setLayout(null);
        JButton btn1 = new JButton("button");
        btn1.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                  setCursor(new Cursor(Cursor.WAIT_CURSOR));
                  //do my program here
                  try{
                      Thread.sleep(1000);
                  catch(Exception z){};
                  setCursor(new Cursor(Cursor.DEFAULT_CURSOR));
        });//emd ActionListener
        btn1.setSize(90, 30);
        btn1.setLocation(50, 40);
        btn1.setCursor(new Cursor(Cursor.HAND_CURSOR));
        add(btn1);
}//end class panelwhat did i do wrong in there...because every time i pressed the button..the cursor still Hand Cursor
Thx
tys
Edited by: KingMao on 22 Sep 08 19:35

Hope this wll helps to you.
class add_panel extends JPanel{
    public add_panel(){
        setLayout(null);
        final JButton btn1 = new JButton("button");
        btn1.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                  *btn1.setCursor(new Cursor(Cursor.WAIT_CURSOR));*
                  //do my program here
                  try{
                      Thread.sleep(1000);
                      *btn1.setCursor(Cursor.getPredefinedCursor(Cursor.DEFAULT_CURSOR));*
                  catch(Exception z){};
                  setCursor(new Cursor(Cursor.DEFAULT_CURSOR));
        });//emd ActionListener
        btn1.setSize(90, 30);
        btn1.setLocation(50, 40);
        btn1.setCursor(new Cursor(Cursor.HAND_CURSOR));
        add(btn1);
}//end class panel

Play/Pause animation on cursor rollover!

Hi,
I have a sequence of images that make up an animation.
I want it so...
     - when the file initially opens, the first frame is showed
     - when the cursor rolls over the frame, the animation plays
     - the animation keeps playing until the cursor is taken off the frame, at which point it is paused.
My animation has sound.
No buttons, just plain and simple cursor roll over.
Thank you for any help you guys can give me!
Sam

Thank you so much for your help Ned!
But I'm still having problems....It's made no difference what so ever and I've done exactly what you've said.
I've got some pictures here to help.
Below is shot of my timeline as I see it...
This is also the code I have inserted on the first frame of the "Actions layer"....
These are some errors with the code (not sure if this is relevant)....
Any more ideas Ned?

Spry Menu Bar css not compatible with IE7? or compatibility View on IE8?

Well i've made my website
. Swimmerbuddy.com
Problem:I used the spry menu bar on a div tag. I've got it working fine on several browser and so on.. but hmm. i noticed that IE7 and only on compatibility view of IE8 it does not work...
It seems like the drop down menus get cover by the main content underneath it..
I started of with dwt i made my self.This is the DWT and the css that controll the dwt and the spry menu bar.
PLZ HELP ME.. THANKS
THIS IS THE DWT THAT THE PAGE RUNS ON
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

<link href="../CSS/main.css" rel="stylesheet" type="text/css" />


<style type="text/css">
a:link {
color: #000;
text-decoration: none;
</style>
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
a:visited {
color: #000;
text-decoration: none;
a:hover {
text-decoration: none;
color: #000;
a:active {
text-decoration: none;
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
    <div id="networkicons"><a href="http://www.facebook.com/?ref=logo#!/profile.php?id=100001554936595" target="_blank"><img src="../_images/facebook.png" alt="facebook.com" width="45" height="45" border="0" title="facebook.com"/></a><a href="http://www.myspace.com/swimmerbuddy" TARGET="_blank"> <img src="../_images/myspace.png" alt="myspace.com" width="44" height="45" border="0" title="myspace.com"/></a><a href="http://twitter.com/swimmerbuddy" TARGET="_blank"> <img src="../_images/twitter.png" alt="twitter.com" width="43" height="45" border="0" title="twitter.com"/></a><a href="http://www.youtube.com/swimmerbuddy1" TARGET="_blank"> <img src="../_images/youtube.png" alt="youtube.com" width="44" height="45" border="0" title="youtube.com"/></a></div>
    <div id="buyNow1">
      <p><a href="../order_now.html"><img src="../buynowbutton.png" alt="bt1" width="130" height="25" border="0" longdesc="Order Your Swimmer Buddy Today!!" /></a></p>
    </div>
</div>
<div id="mainNav">
    <ul id="mainNavcontent" class="MenuBarHorizontal">
      <li><a href="../index.htm">Home</a>        </li>
      <li><a href="../swimmer.html">Swimmer Buddy</a></li>
      <li><a href="../order_now.html">Order Now</a>        </li>
      <li><a href="#" class="MenuBarItemSubmenu">Gallery</a>
        <ul>
          <li><a href="../photo_gallery.html">Photos</a></li>
          <li><a href="../video_gallery.html">Videos</a></li>
        </ul>
      </li>
      <li><a href="#" class="MenuBarItemSubmenu">Zinger Products</a>
        <ul>
          <li><a href="http://www.winkyscoop.com/">Winky Scoop</a></li>
          <li><a href="http://www.1800succeed.com/">Hypmovation</a></li>
          <li><a href="http://www.1800succeed.org/">1800SUCCEED</a></li>
          <li><a href="http://www.zingerproducts.com">Zinger Store</a></li>
        </ul>
      </li>
      <li><a href="../about.html">About Us</a></li>
      <li><a href="../contact.html">Contact Us</a></li>
    </ul>
</div>

<div id="pageInfo">
    <div id="info_page">
      <p class="regionID">Region ID</p>
      <hr class="breaklinePageInfo" />
      <p class="breadcrum">> <a href="../index.htm">Breadcrum </a></p>
    </div>
    <div id="mainContent">
      <div id="content">
        <p>Main Content Goes her</p>
      </div>
    </div>
</div>


   <div id="buyNow2"><a href="../order_now.html"><img src="../buynowbutton.png" width="130" height="25" /></a></div>
   
<div id="footer">
<div id="footertext">
        <p class="footertextclass">Copyright © 2010 SwimmerBuddy.com. All rights reserved. SwimmerBuddy.com is part of <a href="http://www.zingerproducts.com" class="footertextclass">Zinger Products</a>. Designated Trademarks and brands are the property of their respective owners. This page was last modified Setember 28,2010. Swimmer Buddy - Pattent Pending 2010</p>
      </div>
    <div id="footerlinks">
        <p classs="footerlinkspacing"> <span class="footerlinkspacing"><a href="../Disclaimer.html">Disclaimer</a><a href="../terms.html"> Term of Service </a><a href="../contact.html">Contact Us</a></span>
</div>
      </div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("mainNavcontent", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
THIS IS THE MAIN.CSS
@charset "utf-8";
#networkicons {
height: 50px;
width: 200px;
margin-top: 160px;
margin-left: 15px;
position: absolute;
#wrapper {
width: 933px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
text-align: left;
position: relative;
#mainNav {
text-align: center;
position: relative;
margin-right: auto;
margin-left: auto;
width: 934px;
padding-bottom: 15px;
clear: both;
overflow: visible;
#navwrapper {
width: 935px;
margin-right: auto;
margin-left: auto;
#mainContent {
width: 910px;
padding-left: 10px;
padding-right: 10px;
position: relative;
padding-bottom: 20px;
padding-top: 20px;
#content {
width: 910px;
position: relative;
#wrapper #footer #footerlinks p .footerlinkspacing a {
margin-right: 20px;
#footer {
width: 930px;
background-color: #fff;
position: relative;
margin-top: 5px;
text-align: center;
color: #000;
padding-bottom: 10px;
margin-bottom: 15px;
#header {
width: 930px;
height: 209px;
background-image: url(../_images/header.jpg);
background-repeat: no-repeat;
#buyNow1 {
height: 25px;
width: 140px;
float: right;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-align: center;
background-repeat: no-repeat;
color: #666;
padding: 5px;
position: absolute;
top: 160px;
right: 150px;
.buyNow1 {
color: #666;
#wrapper #pageInfo #info_page .breadcrum {
color: #003;
#wrapper #pageInfo #info_page .breadcrum a {
color: #003;
html, body {
margin: 0px;
padding: 0px;
#buyNow2 {
height: 25px;
width: 130px;
float: right;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-align: center;
padding: 5px;
position: relative;
#wrapper #buyNow2 a img {
position: absolute;
top: -30px;
right: 50px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
#pageInfo {
width: 930px;
background-image: url(../_images/pageinfobackground.jpg);
background-repeat: repeat-x;
background-color:#FFF;
text-align: left;
padding-bottom: 15px;
margin-top: 18px;
position: relative;
overflow: visible;
visibility: visible;
#wrapper #mainNav #mainNavcontent {
position: absolute;
left: 0px;
width: 930px;
.regionID {
font-size: 2em;
font-weight: bold;
color: #FFC;
margin-top: 1em;
margin-bottom: 0em;
text-align: left;
margin-left: 5px;
.breaklinePageInfo {
margin-top: 0.5em;
color: #FAFEAB;
.breadcrum {
color: #003;
font-size: 1.1em;
font-weight: bold;
text-decoration: underline;
margin-top: -0.2em;
margin-left: 15px;
#breadcrum {
font-weight: bold;
color: #003;
#footertext {
width: 910px;
font-size: 0.6em;
padding-left: 10px;
padding-right: 10px;
margin-top: 10px;
#footerlinks {
width: 930px;
font-size: 0.7em;
font-weight: bold;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: #000;
position: relative;
margin-top: 10px;
margin-bottom: 5px;
.footertextclass {
color: #000;
.footerlinkspacing {
margin-top: -0.5em;
color: black;
height: 10px;
font-style: normal;
line-height: normal;
font-variant: normal;
letter-spacing: normal;
p {
margin: 0px;
padding: 0px;
body {
text-align: center;
margin-top: 5px;
background-color: #073e78;
background-image: url(../_images/background.jpg);
background-repeat: repeat-x;
background-attachment: scroll;
font-size: 100%;
THIS IS THE dropdown menu.css
@charset "UTF-8";
/* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
ul.MenuBarHorizontal
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
/* 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;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
margin: 0px;
padding: 0;
list-style-type: none;
font-size: 100%;
position: static;
text-align: center;
cursor: pointer;
width: 132.8px;
float: left;
overflow: visible;
visibility: visible;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 132.8px;
position: absolute;
left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 8.2em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: #333;
color: #FFF;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #FFF;
padding: 0.5em 0.75em;
color: #333;
text-decoration: none;
background-image: url(../_images/bar-top.png);
background-repeat: no-repeat;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #003;
background-image: url(../_images/bar-Bottom.png);
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
color: #003;
background-image: url(../_images/bar-Bottom.png);
background-position: bottom;
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.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(../_images/bar-topsub.png);
background-repeat: no-repeat;
background-position: right top;
/* 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.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* 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.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(../_images/bar-topsubhover.png);
background-repeat: no-repeat;
background-position: right bottom;
/* 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.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;

Thanks a lot for that tip. It does improve it by a whole lot.. i c what my mistake was.. however, something is still off
.. The Drop down menu is not behaving well...
As you may c by the picture, the drop down menu now moves to the right. and is not because of the object to its left, i've modified that. Zinger Products Drop Down Menu also does the same.

Spry Menu Appears different in IE8 and IE7

All,
As most of the people who post on this site I am new to Dreamweaver CS4. I think I've done a pretty good job and programming my site and my skills will only get better with time. However I am having one issue that I have wrestled with all day. The site I am creating is located at http://www.greenehazel.com/beta. The spry menu looks fine if I access it with IE8, but when I access it in IE7 some of the rows appear on top of other rows etc. I have fiddled with the CSS on this for most of the day and can't figure out why this is occuring. I have attached the CSS below. What am I doing wrong? Any help is greatly appreciated in advance.
@charset "UTF-8"; /* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */ ul.MenuBarHorizontal { margin: 0; list-style-type: none; font-size: 100%; cursor: default; width: auto; padding: 0; padding-top: 5px; text-align: center; } /* 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; } /* Menu item containers, position children relative to this container and are a fixed width */ ul.MenuBarHorizontal li { margin: 0; padding: 0; list-style-type: none; font-size: 100%; position: relative; text-align: left; cursor: pointer; width: 8em; float: left; } /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */ ul.MenuBarHorizontal ul { margin: 0; padding: 0; list-style-type: none; font-size: 100%; z-index: 1020; cursor: default; width: 8.2em; position: absolute; left: -1000em; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible { left: auto; background-color: #000; border-color: #999; } /* Menu item containers are same fixed width as parent */ ul.MenuBarHorizontal ul li { width: auto; } /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ ul.MenuBarHorizontal ul ul { position: absolute; margin: -5% 0 0 95%; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible { left: auto; top: 0px; background-color: #000; } /******************************************************************************* DESIGN INFORMATION: describes color scheme, borders, fonts *******************************************************************************/ /* Submenu containers have borders on all sides */ ul.MenuBarHorizontal ul { border: 1px solid #CCC; } /* Menu items are a light gray block with padding and no text decoration */ ul.MenuBarHorizontal a { display: block; cursor: pointer; background-color: #000; color: #FFF; text-decoration: none; text-align: center; } /* Menu items that have mouse over or focus have a blue background and white text */ ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus { background-color: #000; color: #00F; width: auto; text-align: center; } /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */ ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible { background-color: #33C; color: #FFF; text-align: center; } /******************************************************************************* 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.MenuBarHorizontal a.MenuBarItemSubmenu { background-image: url(SpryMenuBarDown.gif); background-repeat: no-repeat; background-position: 95% 50%; } /* 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.MenuBarHorizontal ul a.MenuBarItemSubmenu { background-image: url(SpryMenuBarRight.gif); background-repeat: no-repeat; background-position: 95% 50%; } /* 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.MenuBarHorizontal a.MenuBarItemSubmenuHover { background-image: url(SpryMenuBarDownHover.gif); background-repeat: no-repeat; background-position: 95% 50%; } /* 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.MenuBarHorizontal ul a.MenuBarItemSubmenuHover { background-image: url(SpryMenuBarRightHover.gif); background-repeat: no-repeat; background-position: 95% 50%; } /******************************************************************************* 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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE { display: inline; f\loat: left; background: #FFF; } }

@charset "UTF-8";
/* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
ul.MenuBarHorizontal
margin: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
padding: 0;
padding-top: 5px;
text-align: center;
/* 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;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 8em;
float: left;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 8.2em;
position: absolute;
left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
background-color: #000;
border-color: #999;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: auto;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0px;
background-color: #000;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #000;
color: #FFF;
text-decoration: none;
text-align: center;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
background-color: #000;
color: #00F;
width: auto;
text-align: center;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
background-color: #33C;
color: #FFF;
text-align: center;
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.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* 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.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* 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.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* 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.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;

Rollover cursor in IE7?

Similar Messages

Maybe you are looking for