Public Forums 71,145 posts

[damonwilder Friend damonwilderJoin date: October 2010Posts: 12Downloads:0Uploads:1]

#163375

Hi User,

on my page I use Joomla 1.5 and a copy of JA Purity II (called JA Purity II _ 2) and changed some things. Now I noticed, that the hover-effect doesn’t work for me. I switched back to the original template, but it also doesn’t work.

Have anybody some ideas what could be the problem?

Regards
DamonWilder

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#389947

Hi,

Please check the screenshot attached. You can see the color difference on mouseover. Am I checking the correct menu?

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#389951

The image did not show up when I attached it before so trying again. But if still does not show up, please check the menu items under BattleLore, they are changin background colors on mouseover…

---

Attachments:

1. 

[damonwilder Friend damonwilderJoin date: October 2010Posts: 12Downloads:0Uploads:1]

#389954

Dear himangi,

it was my failure. I didn’t name the problem correct. I don’t mean the hover effect, as you can see the color changes works well. I mean the dynamic of the sub-menues.
I you choose a submenu with the mouse, than the submenu is shown below the mainmenu. But if you leave the submenu-area, then the submenu didn’t fade away. – That’s my problem. 🙁

Thanx and greetings to India.

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#389979

Hi,

As I understood it, if you mouseover on main menu item, you can see the dropdown with multiple columns etc but if you take your mouse curser away from the main menu item and the dropdown submenu, then the submenu remains open.

I see that the submenu closes after little delay, but it definitely does not remain open.. Am I getting it correctly now??

[damonwilder Friend damonwilderJoin date: October 2010Posts: 12Downloads:0Uploads:1]

#390009

Hi Himangi,

that exactly, what I meant. But I use Firefox 4.0.1 and the submenu doesn’t close after a delay. it remains open. I don’t try it with other browsers…

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#390365

Hi,

I dont have FF 4 yet, I will check your issue in it and get back asap.

[damonwilder Friend damonwilderJoin date: October 2010Posts: 12Downloads:0Uploads:1]

#390366

Hi Himangi,

I tested it with FF4, Chrome 11.0.x and Safari 5.33.x. Just the Safari-Browser works well, the other two doesn’t work and I don’t tested FF 3.x.

Thanx for your help.

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#391051

Hi,

I checked the Purity II demo in FF4 and chrome and it is working fine. It seems that the issue is solved in the latest version. Can you please check if you are using the latest version of the template?

[damonwilder Friend damonwilderJoin date: October 2010Posts: 12Downloads:0Uploads:1]

#391059

Hi himangi,

I use the latest Purity II Version 1.2.0. Maybe I change somethin in the source code. So I’ll post here my personal mega.css:

.ja-megamenu { margin: 0; padding: 0; }
.ja-megamenu a.over, .ja-megamenu a.active { color: #ffffff !important; }

ul.megamenu { margin: 10px; /* menu's gutter */ }

/* lv - 0
-----------------------------------*/
/* Styling ---*/
ul.level0 {
border-right: 1px solid #666666;
float: left;
margin: 0;
padding: 0;
}

ul.level0 li.mega {
background: none;
display: block;
float: left;
margin: 0;
padding: 0;
}

ul.level0 li.mega a.mega {
border-left: 1px solid #666666;
border-right: 1px solid #333333;
color: #cccccc;
display: block;
font-weight: bold;
line-height: normal;
margin: 0;
padding: 8px 15px;
text-decoration: none;
}

ul.level0 li.mega .has-image {
padding-left: 25px;
display: block;
background-repeat: no-repeat;
background-position: left top;
}

ul.level0 li.mega span.menu-title { display: block; }

ul.level0 li.mega span.menu-desc {
display: block;
font-weight: normal;
font-size: 92%;
color: #999;
}

ul.level0 li.mega a img {
float: left;
padding-right: 5px;
}

ul.level0 li.over, ul.level0 li.haschild-over {
background: url(../../images/grad1-mask.png) repeat-x top #666666;
}

ul.level0 li.haschild a.mega span.menu-title,
ul.level0 li.haschild-over a.mega span.menu-title {
background: url(../../images/arrow3.png) no-repeat left center;
padding-left: 12px;
}

ul.level0 li.haschild a.mega span.menu-desc,
ul.level0 li.haschild-over a.mega span.menu-desc {
padding-left: 12px;
}

ul.level0 li.active {
background: url(../../images/grad1-mask.png) repeat-x top #006699;
}

/* lv - 1 and below
-----------------------------------*/
/* Layout ---*/
.ja-megamenu li.mega .childcontent { display: block; height: auto; position: absolute; }

.ja-megamenu li.mega .childcontent,
.ja-megamenu li.haschild-over li.mega .childcontent,
.ja-megamenu li.mega li.haschild-over li.mega .childcontent ,
.ja-megamenu li.mega li.mega li.haschild-over li.mega .childcontent,
.ja-megamenu li.mega li.mega li.mega li.haschild-over li.mega .childcontent,
.ja-megamenu li.mega li.mega li.mega li.mega li.haschild-over li.mega .childcontent { left: -999em; /*hide the menu*/ }

.ja-megamenu li.haschild-over .childcontent,
.ja-megamenu li.mega li.haschild-over .childcontent,
.ja-megamenu li.mega li.mega li.haschild-over .childcontent,
.ja-megamenu li.mega li.mega li.mega li.haschild-over .childcontent,
.ja-megamenu li.mega li.mega li.mega li.mega li.haschild-over .childcontent,
.ja-megamenu li.mega li.mega li.mega li.mega li.mega li.haschild-over .childcontent { left: auto; /*show on parent:hover*/ }

.ja-megamenu li.mega .right,
.ja-megamenu li.haschild-over li.mega .right,
.ja-megamenu li.mega li.haschild-over li.mega .right ,
.ja-megamenu li.mega li.mega li.haschild-over li.mega .right,
.ja-megamenu li.mega li.mega li.mega li.haschild-over li.mega .right,
.ja-megamenu li.mega li.mega li.mega li.mega li.haschild-over li.mega .right { right: auto; /*hide the menu*/ }

.ja-megamenu li.haschild-over .right
{ right: 0; /*show on parent:hover*/ }
.ja-megamenu li.mega li.haschild-over .right,
.ja-megamenu li.mega li.mega li.haschild-over .right,
.ja-megamenu li.mega li.mega li.mega li.haschild-over .right,
.ja-megamenu li.mega li.mega li.mega li.mega li.haschild-over .right,
.ja-megamenu li.mega li.mega li.mega li.mega li.mega li.haschild-over .right
{ right: 12em; /*show on parent:hover*/ }

ul.level1 li.mega { float: none; }

ul.level1 .childcontent { margin: -2em 0 0 160px; }

/* Columns ---*/
.megacol { float: left;}
/*
.cols1 .megacol { width: 100px }
.cols2 .megacol { width: 50%; }
.cols3 .megacol { width: 33.3%; }
.cols4 .megacol { width: 25%; }
.cols5 .megacol { width: 20%; }
.cols6 .megacol { width: 16.6%; }
.cols7 .megacol { width: 14.2%; }
.cols8 .megacol { width: 12.5%; }
.cols9 .megacol { width: 11.1%; }
.cols10 .megacol { width: 10%; }

.ja-megamenu .cols1 { width: 200px; }
.ja-megamenu .cols2 { width: 400px; }
.ja-megamenu .cols3 { width: 600px; }
.ja-megamenu .cols4 { width: 800px; }
.ja-megamenu .cols5 { width: 1000px; }
.ja-megamenu .cols6 { width: 1200px; }
.ja-megamenu .cols7 { width: 1400px; }
.ja-megamenu .cols8 { width: 1800px; }
.ja-megamenu .cols9 { width: 2000px; }
.ja-megamenu .cols10 { width: 2200px; }
*/

/* Styling ---*/
ul.level1 li.mega { border-top: 1px dotted #444444; }

ul.level1 li.first { border-top: 0; }

ul.level1 li.mega a.mega {
background: none;
border: 0;
color: #cccccc;
font-weight: normal;
padding: 5px;
}

ul.level1 li.mega a.mega span.menu-title { background: none; padding: 0; }

ul.level1 li.haschild {
background: url(../../images/arrow.png) no-repeat 95% center;
padding: 0;
}

ul.level1 li.over, ul.level1 li.haschild-over { background: #444444; }

ul.level1 li.group { background: none; }

/* CHILD CONTENT
-----------------------------------*/
.childcontent {
z-index: 999;
}
.childcontent-inner {
background: #333333;
border: 1px solid #666666;
color: #ccc;
}
.childcontent .ja-moduletable {
color: #ccc;
border-bottom: 0;
line-height: 1.5;
margin: 10px 0;
padding: 0;
}

.childcontent .ja-moduletable h3 {
background: none;
color: #fff;
border-bottom: 1px dotted #444;
margin-left: 10px;
margin-right: 10px;
text-indent: 5px;
text-transform: none;
}

.childcontent .ja-moduletable .ja-box-ct {
padding: 0 5px;
}

.childcontent .ja-moduletable a {
color: #ccc;
text-decoration: none;
border-bottom: 1px dotted #ccc;
}

.childcontent .ja-moduletable a:hover,
.childcontent .ja-moduletable a:focus,
.childcontent .ja-moduletable a:active {
color: #fff;
text-decoration: none;
border-bottom: 1px solid #fff;
}

.childcontent .ja-moduletable ul:first-child {
margin-top: 0 !important;
}

.childcontent .ja-moduletable li {
background: url(../../images/bullet2.gif) no-repeat 2px 7px !important;
margin-bottom: 5px;
}

/* Grouped --- */
.group {}

.group-title {
border-bottom: 1px solid #444;
overflow: hidden;
}

.group-title .menu-title {
color: #fff;
text-transform: uppercase;
font-weight: bold;
font-size: 115%;
}

.group-title .menu-desc {
color: #999;
padding-left: 0 !important;
}

.group-content .ja-moduletable,
.group-content ul.megamenu {
margin: 10px; /* Group-content's gutter*/
}

/* reset --- */
.childcontent ul.megamenu .ja-moduletable {
padding: 0;
}

.childcontent ul.megamenu .ja-moduletable h3 {
margin-left: 0;
margin-right: 0;
}

I never changed something in JS-Files.

Thanx.

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#391060

Hi,

It wont be possible to detect a problem by seeing your changed css file.
I will suggest you to check the Purity demo at your end, just to see that it is working as you expect it to be. If it is, please download the template again and replace your modified files with the original template files and then check if the menu works fine for your site too.

Then you can compare the modified file and original file to find the reason behind the problem..

[zajacrob Friend zajacrobJoin date: December 2010Posts: 3Downloads:0Uploads:0]

#391278

<em>@himangi 240201 wrote:</em><blockquote>Hi,

I checked the Purity II demo in FF4 and chrome and it is working fine. It seems that the issue is solved in the latest version. Can you please check if you are using the latest version of the template?</blockquote>

Sorry that I type my comments in a closed topic, but I think that it is not explained until the end. I also have a problem with the mega-menu, FF4 and Chrome – when you open the menu does not close, but in Opera and IE8 is working properly. I did not make any changes to the code or the css. In FF3.6 mega-menu to work slowly, but it worked. It is interesting to me that your demo page works fine in my browser, and Chrome FF4, but my own page is not working properly. I think that there must be some conflict with some module installed, but I do not know what I do not know how to detect such a conflict. Can anyone advise me how to do it and roughly what might cause this conflict? (my site is http://www.anglia4u.pl)

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#391363

Hi,

please check this thread to see if that suggestion solves your problem. http://www.joomlart.com/forums/topic/mega-menu-not-closing-after-removing-cursor/#post-391111

[damonwilder Friend damonwilderJoin date: October 2010Posts: 12Downloads:0Uploads:1]

#391579

<em>@himangi 240620 wrote:</em><blockquote>Hi,

please check this thread to see if that suggestion solves your problem. http://www.joomlart.com/forums/topic/mega-menu-not-closing-after-removing-cursor/#post-391111</blockquote>
Can’t see the post, cause I am not a Club Member 🙁

Since my last post, I replaced all my modified files with the original files from Version 1.2.0. But nothing happens. So it looks like a conflict with a module or component.
Otherwise I can’t see details in the template options.
I worked with a copy of purity_II and I’ve installed the Menu-param-plugin.
See my image.

Thanx,
DamonWilder

---

Attachments:

1. 

[himangi Friend himangiJoin date: April 2011Posts: 1406Downloads:1Uploads:86 Thanks: 21 Thanked: 345 times in 332 posts]

#391620

Hi,

Here is you location of js file: plugins/system/jat3/base-themes/default//js/menu/mega.js. You should copy it to /templates/template_name/js/menu/ and make configure on it.

Hope it works for you.

[Author]

Posts