無法使用classname：使用mootools 1.4工具提示

我一直在嘗試一段時間來在我的網站上實現mootools tooltip sample，問題是我正在使用mootools 1.4（mootools-core-1.4.1-full-compat.js）和例如使用classname即無法使用classname：使用mootools 1.4工具提示

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

不適用於我。我可以看到文本但沒有圖像，螢火蟲淨選項卡不顯示任何資產丟失。

我確實想要使用頁面上的其他示例，但據我所知，這會將我鎖定到工具提示的單個樣式。

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個獨立的假設正確工具提示樣式在頁面上？實際上.tool-*樣式是保留的？我試着像

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

但不分階級的分配相同的

.tool-title 
.tool-text

樣式只有永遠適用。

感謝，

來源

2012-01-22 MikeW

你可以發佈JSFiddle嗎？ –

感謝這裏的小提琴，雖然我似乎沒有與jsfiddle版本http://jsfiddle.net/3By77/ – MikeW

演示似乎使用不同版本的MooTools的更多，這裏是讓你的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/。

此外，您忘記在JSFiddle中激活Mootools More，這就是爲什麼它不起作用。

來源

2012-01-22 15:44:40

運氣不多，非常感謝:)完美。 – MikeW

無法使用classname：使用mootools 1.4工具提示

回答

相關問題