CSS спрайты в WordPress - PullRequest
       13

CSS спрайты в WordPress

0 голосов
/ 22 июня 2011

Я создал спрайт-меню с 5 уровнями.1-й уровень содержит «HOME» и т. Д., А также «SIGNUP» и «LOGIN».2-й уровень - это когда 1-й уровень завис.3-й уровень - когда активен.4-й уровень аналогичен, однако вместо него есть «Мой СЧЕТ» и «ВЫХОД», а на 5-м уровне только «Мой СЧЕТ» и «ВЫХОД».Как бы я сказал WordPress использовать 4-й, если пользователь вошел в систему, и 5-й уровень, если они нажимают / наводят курсор на «Моя учетная запись» и «Выход».Я использую последнюю версию Wordpress.

Ответы [ 2 ]

1 голос
/ 22 июня 2011

Работа с CSS-спрайтами в меню, где каждый элемент является собственным изображением («Домой», «О ....»), очень плохая идея.

  • Это яд для доступности
  • Это может быть вредно для SEO
  • Много работы по поддержанию изображений спрайтов
  • Пункты меню выиграныне масштабируется, когда пользователь использует функцию «зума» своего браузера
  • Пользователи с отключенными изображениями не могут видеть, что говорит пункт меню

Трудно дать альтернативное предложениене видя предполагаемый дизайн, но наиболее распространенный способ - это, вероятно, построить навигацию на основе <ul> (каждый элемент является <li>) и дать каждому элементу фоновое изображение.В зависимости от вашей ситуации, вы можете работать с CSS-спрайтами, чтобы отображать состояния перехода и отсутствия доступа.

1 голос
/ 22 июня 2011

Я бы использовал спрайт в качестве фона меню / кнопок и назначил различные уровни различным классам CSS.

Так что для 5-го уровня вы можете использовать класс: hover. Для 4-го уровня вы можете использовать WordPress, если пользователь вошел в систему, чтобы дать вещи другим классам - так что-то вроде

<?php if ( is_user_logged_in() ) {  ?>
<div class="my-button class-5"></div>
<?php } else { ?>
<div class="my-button class-4"></div>
<?php }; ?>

, где для 'class-4' задан фон для вашего спрайта 4-го уровня, а для 'class-5' задан фон для вашего спрайта 5-го уровня.

...