Founder

SERM-service:
Посмотрите какой-нибудь крупный строительный портал, там есть все что вам нужно.

mark2011:
Есть меню. По наведению мышки текст должен поменяться, а на меню должна быть фоновая картинка. Она одна.

Делаю так:

<div class="menu">

                    <ul>

                        <li><a href="#">главная</a></li>

                        <li><a href="#">о компании</a></li>

                        <li><a href="#">клиенты</a></li>

                        <li><a href="#">оборудование</a></li>

                        <li><a href="#">зона обслуживания</a></li>

                        <li><a href="#">контакты</a></li>

                    </ul>

                </div>

.menu {

    width: 984px;

    height: 45px;

    background-image: url('menu_bg.png');

}



.menu ul {

    list-style-type: none;

    margin-left: 23px;

}



.menu ul li {

    display: inline-block;

    margin-right: 34px;

    text-transform: uppercase;

    font-family: Arial;

    font-size: 12px;

    margin-top: 15px;

   

}



.menu ul li a {

    color: #974a10;

    width: 150px;

}



.menu ul li a:hover {

    color: #fff;

    background-image: url('menu_hover.png');

    width: 128px;

    height: 55px;

    padding-top: 25px;

    padding-bottom: 20px;

    width: 180px;

    padding-right: 10px;

    padding-left: 10px;

}

Но как-то очень неустойчиво и косячно получается.....
есть вариант получше?

mark2011:


Делаю так:

<div class="menu">

                    <ul>

                        <li><a href="#">главная</a></li>

                        <li><a href="#">о компании</a></li>

                        <li><a href="#">клиенты</a></li>

                        <li><a href="#">оборудование</a></li>

                        <li><a href="#">зона обслуживания</a></li>

                        <li><a href="#">контакты</a></li>

                    </ul>

                </div>

.menu {

    width: 984px;

    height: 45px; // убрать или увеличить

    background-image: url('menu_bg.png');

}



.menu ul {

    list-style-type: none;

    margin-left: 23px;

}



.menu ul li {

    display: inline-block;

    margin-right: 34px;

    text-transform: uppercase;

    font-family: Arial;

    font-size: 12px;

    margin-top: 15px;

   

}



.menu ul li a {

    color: #974a10;

    width: 150px;

}



.menu ul li a:hover {

    color: #fff;

    background-image: url('menu_hover.png');

    width: 128px; // поставте значение 150, почему отличается..

    height: 55px; // поставте значение 45, почему отличается..

    padding-top: 25px;

    padding-bottom: 20px;

    width: 180px; // поставте значение 150, почему отличается..

    padding-right: 10px;

    padding-left: 10px;

}



проверьте какие размеры вы задаете слоям и какие потом пытаетесь в них вложить..

akill:
Модуль от Jumi тоже не работает. Обрезает как визуальный редактор.

DEDMityay:
Здравствуйте! вопрос для тех, кто использует virtue mart.

вот к примеру категория: http://upakovky.ru/index.php/Root-category-1/Category-42/View-all-products

как сделать так, чтобы отдельные товары не были ссылками т.е. функция, которая позволяет перейти на отдельную страницу товара не нужна. Как это пофиксить?