pop login
- Posted by erwinschro (1034) Offline
- Posted by Vivi (5) Offline
Hi! I think it is the same problem other people here were having. The popbox won't go in front of the fade. I've tried messing with the z-index in the module and in the template, and managed to move things around (at one point the menu and logo of my template was also in front of the popbox). When the fade is in front, you can't type in it. I think I also accidentally moved the blue area on the right of the box up slightly. In the module file it looks like this (I have made the fade half wide to be able to access the typing area of the box):
#fade { /*--Transparent background layer--*/
display: none; /*--hidden by default--*/
background: #333;
position: fixed; left: 0; top: 0;
width: 50%; height: 100%;
opacity: .80;
z-index: 90;
.popbox{
display: none; /*--hidden by default--*/
background: #fff;
float: left;
font-size: 1.2em;
position: fixed;
top: 50%; left: 50%;
z-index: 999999;
/*--CSS3 Box Shadows--*/
-webkit-box-shadow: 0px 0px 10px #000;
-moz-box-shadow: 0px 0px 10px #000;
box-shadow: 0px 0px 10px #000;
/*--CSS3 Rounded Corners--*/
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
And in the template.css, I found these z-indices:
menu {
z-index: 89;
headerright-wrapper {
z-index: 89;
logo {
z-index: 89;
content-top
z-index: 88;
a.link-tooltip:hover {
z-index: 25;
joomla-25 .tip {
z-index: 88;
div[id*=jsn-pos-stick-] {
position: fixed;
z-index: 888888;
I hope that is enough information, because I certainly don't know what I am doing. I am using the jsn pixel template (demo: demo.joomlashine.com/joomla-templates/js...cle&id=93&Itemid=479 )
Thanks!
11 years 2 months ago #14
by Vivi
#fade { /*--Transparent background layer--*/
display: none; /*--hidden by default--*/
background: #333;
position: fixed; left: 0; top: 0;
width: 50%; height: 100%;
opacity: .80;
z-index: 90;
.popbox{
display: none; /*--hidden by default--*/
background: #fff;
float: left;
font-size: 1.2em;
position: fixed;
top: 50%; left: 50%;
z-index: 999999;
/*--CSS3 Box Shadows--*/
-webkit-box-shadow: 0px 0px 10px #000;
-moz-box-shadow: 0px 0px 10px #000;
box-shadow: 0px 0px 10px #000;
/*--CSS3 Rounded Corners--*/
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
And in the template.css, I found these z-indices:
menu {
z-index: 89;
headerright-wrapper {
z-index: 89;
logo {
z-index: 89;
content-top
z-index: 88;
a.link-tooltip:hover {
z-index: 25;
joomla-25 .tip {
z-index: 88;
div[id*=jsn-pos-stick-] {
position: fixed;
z-index: 888888;
I hope that is enough information, because I certainly don't know what I am doing. I am using the jsn pixel template (demo: demo.joomlashine.com/joomla-templates/js...cle&id=93&Itemid=479 )
Thanks!
Please Log in or Create an account to join the conversation.
- Posted by erwinschro (1034) Offline
I can't help you with such an info...
can you just post a live url if you want us to take a look? Or you can ask your template provider regarding this z-index issue conflict.
11 years 2 months ago #15
by erwinschro
can you just post a live url if you want us to take a look? Or you can ask your template provider regarding this z-index issue conflict.
Please Log in or Create an account to join the conversation.
- Posted by Vivi (5) Offline
Thanks erwinschro! I am still using a template sample, see my problem at phonologicalloop.com You'll see the fade is still at 50% width. Login Button on the top right of the page.
Two more things:
a) Do you know if I have to use the button. I'm thinking a text link would look better up there.
b) Do you know if the text in the box is editable somewhere?
11 years 2 months ago #16
by Vivi
Two more things:
a) Do you know if I have to use the button. I'm thinking a text link would look better up there.
b) Do you know if the text in the box is editable somewhere?
Please Log in or Create an account to join the conversation.
- Posted by erwinschro (1034) Offline
In the .popbox class you still set the width to only 50%. It should be 100%.
then z-index inside it, try with 88.
for a) sorry...you can try yourself editing the code inside /mod_poplogin/tmpl/default.php
b) you can edit them inside the language file of mod_poplogin
/language/en-GB/en-GB.mod_poplogin.ini
11 years 2 months ago #17
by erwinschro
then z-index inside it, try with 88.
for a) sorry...you can try yourself editing the code inside /mod_poplogin/tmpl/default.php
b) you can edit them inside the language file of mod_poplogin
/language/en-GB/en-GB.mod_poplogin.ini
Please Log in or Create an account to join the conversation.
- Posted by Vivi (5) Offline
Thank you so much for your attention! Great, the box is now in front of the fade, but so was the logo, menu, and login button. I set the logo z-index to 77 and it worked, but if I do it to -menu (set to 89), -content-top (set to 88), everything (including the popup box) goes behind the fade. Sorry, I don't know how this z-index works!
11 years 2 months ago #18
by Vivi
Please Log in or Create an account to join the conversation.