سلام
من يك منوي بازشو ساختم كه يك تصوير پس زمينه براي هر خط منو قرار دادم و يك تصوير هم گذاشتم كه وقتي روش ميري عوض بشه و خاكستري رنگ بشه
وقتي تو firefox ميري روشون همه چي درست نشون داده ميشه ولي وقتي تو IE ميري عكسا غيب ميشن و يكي دو ثانيه بعد لود ميشن و ميان سر جاشون
حالت درستش اينه
http://upload.parsiking.com/uploads/1207029507.png
حالت نادرستش
http://upload.parsiking.com/uploads/1207019320.png
من يك منوي بازشو ساختم كه يك تصوير پس زمينه براي هر خط منو قرار دادم و يك تصوير هم گذاشتم كه وقتي روش ميري عوض بشه و خاكستري رنگ بشه
وقتي تو firefox ميري روشون همه چي درست نشون داده ميشه ولي وقتي تو IE ميري عكسا غيب ميشن و يكي دو ثانيه بعد لود ميشن و ميان سر جاشون
حالت درستش اينه
http://upload.parsiking.com/uploads/1207029507.png
حالت نادرستش
http://upload.parsiking.com/uploads/1207019320.png
کد:
/* ThemePanelMenu Style Sheet */
.ThemePanelMenuH,
.ThemePanelMenuV,
.ThemePanelSubMenuTable {
font-family: Tahoma, arial, sans-serif;
font-size: 13px;
background-color:#333333;
cursor: default;
white-space: nowrap;
}
.ThemePanelMenuV {
width: 100%;
}
.ThemePanelMenuH span {
vertical-align:bottom;
}
.ThemePanelSubMenu {
position: absolute;
visibility: hidden;
/*
Netscape/Mozilla renders borders by increasing
their z-index. The following line is necessary
to cover any borders underneath
*/
z-index: 100;
border: 0;
padding: 0;
/* the following property is only useful in IE */
filter:progid:DXImageTransform.Microsoft.Shadow(color=#DEDEDE,Direction=135,Strength=4);
}
.ThemePanelSubMenuTable {
border: 1px solid #9C9A9C;
}
.ThemePanelMenuItem,
.ThemePanelMenuItemHover,
.ThemePanelMenuItemActive {
cursor: hand;
white-space: nowrap;
}
.ThemePanelMainItem,
.ThemePanelMenuItem {
background : url(../images/top_bgmenu2.gif) repeat-x;
}
.ThemePanelMainItemHover,
.ThemePanelMainItemActive,
.ThemePanelMenuItemHover,
.ThemePanelMenuItemActive {
background : url(../images/top_bgmenu.gif) repeat-x;
}
/* horizontal main menu sub components */
/* panel doesn't really support horizontal menus */
.ThemePanelMenuH .ThemePanelMainItem {
padding: 0px 0px;
}
.ThemePanelMainFolderLeft,
.ThemePanelMainItemLeft,
.ThemePanelMainFolderText,
.ThemePanelMainItemText,
.ThemePanelMainFolderRight,
.ThemePanelMainItemRight {
border: 0;
background-color: inherit;
white-space: nowrap;
color:#EEFF7E;
}
/* vertical main menu sub components */
.ThemePanelMenuV td.ThemePanelMainFolderLeft,
.ThemePanelMenuV td.ThemePanelMainItemLeft {
padding-left: 0px;
padding-right: 0px;
border-left: 1px solid #9C9A9C;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuV td.ThemePanelMainFolderLeft,
.ThemePanelMenuV td.ThemePanelMainItemLeft,
.ThemePanelMenuV td.ThemePanelMainFolderText,
.ThemePanelMenuV td.ThemePanelMainItemText,
.ThemePanelMenuV td.ThemePanelMainFolderRight,
.ThemePanelMenuV td.ThemePanelMainItemRight {
padding-top: 2px;
padding-bottom: 2px;
border-top: 1px solid #9C9A9C;
border-bottom: 1px solid #9C9A9C;
color:#EEFF7E;
background-color: inherit;
}
.ThemePanelMenuV td.ThemePanelMainFolderLeft,
.ThemePanelMenuV td.ThemePanelMainItemLeft {
padding-right: 0px;
padding-left: 0px;
border-left: 1px solid #9C9A9C;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelMenuV td.ThemePanelMainFolderText,
.ThemePanelMenuV td.ThemePanelMainItemText {
padding-right: 10px;
padding-left: 10px;
color:#EEFF7E;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelMenuV td.ThemePanelMainFolderRight,
.ThemePanelMenuV td.ThemePanelMainItemRight {
padding-right: 0px;
padding-left: 0px;
border-right: 1px solid #9C9A9C;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelMenuV tr.ThemePanelMainItem td.ThemePanelMainFolderLeft {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 1px;
padding-right: 0px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuV tr.ThemePanelMainItem td.ThemePanelMainItemLeft {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 1px;
padding-right: 0px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuV tr.ThemePanelMainItem td.ThemePanelMainFolderText {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 10px;
padding-right: 10px;
color:#EEFF7E;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuV tr.ThemePanelMainItem td.ThemePanelMainItemText {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 10px;
padding-right: 10px;
color:#EEFF7E;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuV tr.ThemePanelMainItem td.ThemePanelMainItemRight {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 0px;
padding-right: 1px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuV tr.ThemePanelMainItem td.ThemePanelMainFolderRight {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 0px;
padding-right: 1px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
/* sub menus sub components */
.ThemePanelSubMenu .ThemePanelMenuFolderLeft,
.ThemePanelSubMenu .ThemePanelMenuItemLeft {
padding-left: 0px;
padding-right: 0px;
border-left: 1px solid #9C9A9C;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelSubMenu .ThemePanelMenuFolderLeft,
.ThemePanelSubMenu .ThemePanelMenuItemLeft,
.ThemePanelSubMenu .ThemePanelMenuFolderText,
.ThemePanelSubMenu .ThemePanelMenuItemText,
.ThemePanelSubMenu .ThemePanelMenuFolderRight,
.ThemePanelSubMenu .ThemePanelMenuItemRight {
padding-top: 2px;
padding-bottom: 2px;
border-top: 1px solid #9C9A9C;
border-bottom: 1px solid #9C9A9C;
color:#EEFF7E;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelSubMenu .ThemePanelMenuFolderLeft,
.ThemePanelSubMenu .ThemePanelMenuItemLeft {
padding-right: 0px;
padding-left: 2px;
border-left: 1px solid #9C9A9C;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelSubMenu .ThemePanelMenuFolderText,
.ThemePanelSubMenu .ThemePanelMenuItemText {
padding-right: 3px;
padding-left: 5px;
color:#EEFF7E;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelSubMenu .ThemePanelMenuFolderRight,
.ThemePanelSubMenu .ThemePanelMenuItemRight {
padding-right: 0px;
padding-left: 0px;
border-right: 1px solid #9C9A9C;
background-color: inherit;
white-space: nowrap;
}
.ThemePanelSubMenu tr.ThemePanelMenuItem td.ThemePanelMenuFolderLeft {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 3px;
padding-right: 0px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelSubMenu tr.ThemePanelMenuItem td.ThemePanelMenuItemLeft {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 3px;
padding-right: 0px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelSubMenu tr.ThemePanelMenuItem td.ThemePanelMenuFolderText {
padding-top: 3px;
padding-bottom: 3px;
padding-right: 3px;
padding-left: 5px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelSubMenu tr.ThemePanelMenuItem td.ThemePanelMenuItemText {
padding-top: 3px;
padding-bottom: 3px;
padding-right: 3px;
padding-left: 5px;
color:#EEFF7E;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelSubMenu tr.ThemePanelMenuItem td.ThemePanelMenuItemRight {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 0px;
padding-right: 1px;
color:#EEFF7E;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelSubMenu tr.ThemePanelMenuItem td.ThemePanelMenuFolderRight {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 0px;
padding-right: 1px;
border: 0;
white-space: nowrap;
background-color: inherit;
}
.ThemePanelMenuSplit {
margin: 2px;
height: 1px;
overflow: hidden;
background-color: inherit;
border-top: 1px solid #9C9A9C;
}
/* image shadow animation */
/*
seq1: image for normal
seq2: image for hover and active
To use, in the icon field, input the following:
<img class="seq1" src="normal.gif" /><img class="seq2" src="hover.gif" />
*/
.ThemePanelMainItem img.seq1,
.ThemePanelMenuItem img.seq1 {
display: inline;
}
.ThemePanelMainItemHover img.seq2,
.ThemePanelMainItemActive img.seq2,
.ThemePanelMenuItemHover img.seq2,
.ThemePanelMenuItemActive img.seq2 {
display: inline;
}
.ThemePanelMainItem img.seq2,
.ThemePanelMainItemHover img.seq1,
.ThemePanelMainItemActive img.seq1,
.ThemePanelMenuItem img.seq2,
.ThemePanelMenuItemHover img.seq1,
.ThemePanelMenuItemActive img.seq1 {
display: none;
}