Невозможно использовать имя класса: с подсказками mootools 1.4 - PullRequest
0 голосов
/ 22 января 2012

Я некоторое время пытался реализовать этот пример подсказки mootools на моем сайте, проблема в том, что я использую mootools 1.4 (mootools-core-1.4.1-full-compat.js) и пример использования classname т.е.

var Tips4 = new Tips($$('.Tips4'), {
    className: 'custom'
});

не будет работать для меня. Я вижу текст, но изображение отсутствует, на вкладке firebug net не отображается ни один актив.

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

 var Tips1 = new Tips($$('.Tips1'));

который тогда имеет настройку css примерно так

.tool-tip {
color: #fff;
width: 139px;
z-index: 13000;
}

.tool-title {
font-weight: bold;
font-size: 11px;
margin: 0;
color: #9FD4FF;
padding: 8px 8px 4px;
background: url(bubble.png) top left;
}

.tool-text {
font-size: 11px;
padding: 4px 8px 8px;
background: url(bubble.png) bottom right;
}

Если пользовательский метод класса не будет работать в 1.4

Правильно ли я предположил, что, используя этот 2-й метод, я не могу иметь 2 отдельных стиля всплывающей подсказки на странице? В действительности стили .tool-* зарезервированы? Я пробовал что-то вроде

.MyOtherTipStyle .tool-title
{
 //etc
}
.MyOtherTipStyle .tool-text
{
 //etc
}

но независимо от класса присвоено одно и то же

.tool-title
.tool-text  

стили применяются только когда-либо.

Спасибо

1 Ответ

0 голосов
/ 22 января 2012

Демонстрационная версия, похоже, использует другую версию Mootools More, вот правильный способ сделать ваш CSS (1.4.2):

.custom { }
  .custom .tip-top { }
  .custom .tip { }
    .custom .tip-title { }
    .custom .tip-text { }
  .custom .tip-bottom { }

Вот обновленная версия вашего JSFiddle, используя предыдущий формат: http://jsfiddle.net/3By77/4/.

Кроме того, вы забыли активировать Mootools More в JSFiddle, поэтому он не работает.

...