Все, есть кроссбраузерное решение)))
1. Открываем файл ../modules/mod_jshopping_manufacturers/tmpl/default.php
и правим строчку 7 (прописываем ей стили) вместо:
<div class = "<?php print $class?>">
вставляем:
<div class = "<?php print $class?>" style="display:block; float:left;">
2. Строчку 10
<img align = "absmiddle" src = "<?php print $jshopConfig->image_manufs_live_path."/".$curr->manufacturer_logo?>" alt = "<?php print $curr->name?>" />
Заменяем на:
<span class="<?php print JApplication::stringURLSafe($curr->name)?>" style="margin: 0 5px;"> </span>
Тем самым мы вытащили классы из массива и транслитерировали их в латиницу (это если у вас название производителя заполнено на русском), для того, чтобы можно было без проблем присвоить этим классам css-стили.
(Спасибо за подсказку
dmitry-stas).
А дальше начинается работа с CSS таблицами.
Я залил стили в JoomShopping. В файл ../components/com_jshopping/css/default_div.css
.jshop_menu_level_0, .jshop_menu_level_0_a{
margin-top:3px;
margin-bottom:3px;
display:block;
float: left;
text-align:justify;
}
.jshop_menu_level_0 span{
display:block;
}
.jshop_menu_level_0_a span{
display:block;
}
.jshop_menu_level_0_a, .jshop_menu_level_0_a:hover{
text-decoration:none;
float: left;
}
.jshop_menu_level_0_a{
display:block;
}
.jshop_menu_level_0_a:hover{
background:transparent;
}
где
.jshop_menu_level_0 это страница входа,
а
.jshop_menu_level_0_a это страница после клика на лого производителя (если не указать стили для этого элемента, после перехода логотип активного производителя исчезнет.)
А далее мы вытягиваем названия производителей из
FireBug и присваиваем им стили, вот так получилось у меня.
.jshop_menu_level_0 .forpost ,
.jshop_menu_level_0_a .forpost {
background: url(/components/com_jshopping/files/img_manufs/forpost1.png) no-repeat;
height: 40px;
width: 120px;
}
.jshop_menu_level_0 .forpost:hover,
.jshop_menu_level_0_a .forpost:hover{
background-position: 0px -40px;
}
.jshop_menu_level_0 .retvizan ,
.jshop_menu_level_0_a .retvizan{
background: url(/components/com_jshopping/files/img_manufs/retvizan.png) no-repeat;
height: 40px;
width: 120px;
}
.jshop_menu_level_0 .retvizan:hover,
.jshop_menu_level_0_a .retvizan:hover{
background-position: 0px -40px;
}
.jshop_menu_level_0 .stop ,
.jshop_menu_level_0_a .stop{
background: url(/components/com_jshopping/files/img_manufs/stop_logo1.png) no-repeat;
height: 40px;
width: 36px;
}
.jshop_menu_level_0 .stop:hover,
.jshop_menu_level_0_a .stop:hover{
background-position: 0px -40px;
}
.jshop_menu_level_0 .vladimirskaya-fabrika-dverej,
.jshop_menu_level_0_a .vladimirskaya-fabrika-dverej {
background: url(/components/com_jshopping/files/img_manufs/fon.png) no-repeat;
height: 40px;
width: 76px;
}
.jshop_menu_level_0 .vladimirskaya-fabrika-dverej:hover,
.jshop_menu_level_0_a .vladimirskaya-fabrika-dverej:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .casaporte,
.jshop_menu_level_0_a .casaporte{
background: url(/components/com_jshopping/files/img_manufs/logo_casaporte.png) no-repeat;
height: 40px;
width: 85px;
}
.jshop_menu_level_0 .casaporte:hover,
.jshop_menu_level_0_a .casaporte:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .verda,
.jshop_menu_level_0_a .verda {
background: url(/components/com_jshopping/files/img_manufs/verda1.png) no-repeat;
height: 40px;
width: 120px;
}
.jshop_menu_level_0 .verda:hover,
.jshop_menu_level_0_a .verda:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .mebeldrev ,
.jshop_menu_level_0_a .mebeldrev{
background: url(/components/com_jshopping/files/img_manufs/mebel_drev_logo_small.png) no-repeat;
height: 40px;
width: 40px;
}
.jshop_menu_level_0 .mebeldrev:hover,
.jshop_menu_level_0_a .mebeldrev:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .tixx,
.jshop_menu_level_0_a .tixx {
background: url(/components/com_jshopping/files/img_manufs/tixx__1_.png) no-repeat;
height: 40px;
width: 128px;
}
.jshop_menu_level_0 .tixx:hover,
.jshop_menu_level_0_a .tixx:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .renz,
.jshop_menu_level_0_a .renz {
background: url(/components/com_jshopping/files/img_manufs/renz1.png) no-repeat;
height: 40px;
width: 133px;
}
.jshop_menu_level_0 .renz:hover,
.jshop_menu_level_0_a .renz:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .archie,
.jshop_menu_level_0_a .archie {
background: url(/components/com_jshopping/files/img_manufs/logo-archie.png) no-repeat;
height: 40px;
width: 35px;
}
.jshop_menu_level_0 .archie:hover,
.jshop_menu_level_0_a .archie:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .apecs,
.jshop_menu_level_0_a .apecs {
background: url(/components/com_jshopping/files/img_manufs/apecs_logo.png) no-repeat;
height: 40px;
width: 55px;
}
.jshop_menu_level_0 .apecs:hover,
.jshop_menu_level_0_a .apecs:hover {
background-position: 0px -40px;
}
.jshop_menu_level_0 .laredo,
.jshop_menu_level_0_a .laredo {
background: url(/components/com_jshopping/files/img_manufs/laredo_logo.png) no-repeat;
height: 40px;
width: 171px;
}
.jshop_menu_level_0 .laredo:hover,
.jshop_menu_level_0_a .laredo:hover {
background-position: 0px -40px;
}
ЗЫ: Если у вас возникли проблемы с отображением (в виде рамок и непонятных черточек) то вам нужно для
a:hover, a:active, a:focus, a:link, a:visited
прописать
text-decoration: none !important;Вот теперь все, пользуйтесь на здоровье.