Page 1 of 1
Detail view: Half images in Firefox 4.0.1
Posted: 08 Jun 2011, 13:50
by offi
Hi there
I just launched my new site,
www.offi.is and it is mainly based on Phoca gallery. I chose Slimbox as the detail view mode. Everything works fine exept when viewed in Firefox 4.0.1. If I browse the detail view by clicking "Next" or "Previous" it tends to cut the images in half, display only half the image, unless I have the mouse over. If I browse the detail view by using the arrows on the keyboard, everything is normal.
Is this a configuration problem or ...? All help would be highly appreciated!
I did search through the forum for this problem, but came out empty.
Best regards
Offi
Re: Detail view: Half images in Firefox 4.0.1
Posted: 08 Jun 2011, 20:56
by Jan
Re: Detail view: Half images in Firefox 4.0.1
Posted: 08 Jun 2011, 21:10
by pitu
Hi,
problem is on your /templates/beez_20/css/personal.css on row 43
Code: Select all
a:hover, a:active, a:focus {
background: none repeat scroll 0 0 #CCCCCC;
color: #FCFCFC;
}
- a:focus overide focus for #lbPrevLink and #lbNextLink (there are not defined) in components/com_phocagallery/assets/js/slimbox/css/slimbox.css
Insert next code to file components/com_phocagallery/assets/js/slimbox/css/slimbox.css or to file /templates/beez_20/css/personal.css
Code: Select all
#lbPrevLink:focus {
background: url("prevlabel.gif") no-repeat scroll 0 15% transparent;
}
#lbNextLink:focus {
background: url("nextlabel.gif") no-repeat scroll 100% 15% transparent;
}
Re: Detail view: Half images in Firefox 4.0.1
Posted: 09 Jun 2011, 14:10
by offi
Thanks a million, guys. Adding the code into the slimbox.css file did the trick. But now the "Next" flip refuses to disappear however. Some css conflict?
Re: Detail view: Half images in Firefox 4.0.1
Posted: 10 Jun 2011, 21:47
by pitu
Hi,
try the next solution (sorry for previous solution - developed and tested only on Firefox Firebug - and my english) :
Code posted above
Code: Select all
#lbPrevLink:focus {
background: url("prevlabel.gif") no-repeat scroll 0 15% transparent;
}
#lbNextLink:focus {
background: url("nextlabel.gif") no-repeat scroll 100% 15% transparent;
}
replace with
Code: Select all
#lbPrevLink:focus {
background: none transparent;
}
#lbNextLink:focus {
background: none transparent;
}
and code in file com_phocagallery/assets/js/slimbox/css/slimbox.css
Code: Select all
#lbPrevLink:hover {
background: url("prevlabel.gif") no-repeat scroll 0 15% transparent;
}
#lbNextLink:hover {
background: url("nextlabel.gif") no-repeat scroll 100% 15% transparent;
}
replace with
Code: Select all
#lbPrevLink:hover {
background: url("prevlabel.gif") no-repeat scroll 0 15% transparent !important;
}
#lbNextLink:hover {
background: url("nextlabel.gif") no-repeat scroll 100% 15% transparent !important;
}
...nice photos...