2013-04-26 43 views
1

從來就一直在努力改變道場的Claro主題,因爲it's太輕了,我想擺脫一些efects的。
其中之一是鼠標移到表格的dijits的。
是否有任何方法來禁用,在一般情況下,鼠標超過在按鈕和輸入文本框等的效果,濾波選擇等..... 我不能趕上螢火的CSS當鼠標「do sth對」的元素。應該有一個類添加到產生該效果的元素中。 任何人都可以告訴它是什麼? 感謝道場Dijit的克拉羅主題禁用鼠標移到

回答

0

簡單-Enabled(啓用)按鈕採取主題測試儀的基本表單控件標籤 - http://download.dojotoolkit.org/release-1.7.0/dojo-release-1.7.0/dijit/themes/themeTester.html?theme=claro

無懸停:

<span class="dijit dijitReset dijitInline dijitButton" role="presentation" widgetid="dijit_form_Button_1"> 
    <span class="dijitReset dijitInline dijitButtonNode" data-dojo-attach-event="ondijitclick:_onClick" role="presentation"> 
     <span class="dijitReset dijitStretch dijitButtonContents" data-dojo-attach-point="titleNode,focusNode" role="button" aria-labelledby="dijit_form_Button_1_label" tabindex="0" id="dijit_form_Button_1"> 
      <span class="dijitReset dijitInline dijitIcon dijitIconTask" data-dojo-attach-point="iconNode"></span> 
      <span class="dijitReset dijitToggleButtonIconChar">?</span> 
      <span class="dijitReset dijitInline dijitButtonText" id="dijit_form_Button_1_label" data-dojo-attach-point="containerNode">Simple</span> 
     </span> 
    </span> 
    <input type="button" value="" class="dijitOffScreen" tabindex="-1" role="presentation" data-dojo-attach-point="valueNode"> 
</span> 

懸停:

<span class="dijit dijitReset dijitInline dijitButton dijitButtonHover dijitHover" role="presentation" widgetid="dijit_form_Button_1"> 
    <span class="dijitReset dijitInline dijitButtonNode" data-dojo-attach-event="ondijitclick:_onClick" role="presentation"> 
     <span class="dijitReset dijitStretch dijitButtonContents" data-dojo-attach-point="titleNode,focusNode" role="button" aria-labelledby="dijit_form_Button_1_label" tabindex="0" id="dijit_form_Button_1"> 
      <span class="dijitReset dijitInline dijitIcon dijitIconTask" data-dojo-attach-point="iconNode"></span> 
      <span class="dijitReset dijitToggleButtonIconChar">?</span> 
      <span class="dijitReset dijitInline dijitButtonText" id="dijit_form_Button_1_label" data-dojo-attach-point="containerNode">Simple</span> 
     </span> 
    </span> 
    <input type="button" value="" class="dijitOffScreen" tabindex="-1" role="presentation" data-dojo-attach-point="valueNode"> 
</span> 

相同的除了外跨度的類...

無懸停:

dijit dijitReset dijitInline dijitButton 

懸停:

dijit dijitReset dijitInline dijitButton dijitButtonHover dijitHover 

其他表單字段可能不同,但您必須查看這些字段。從我看過的很少,我認爲每個表單dijit都有自己的懸停類(es)。

dijitHover似乎是一個功能類,而不是一個UI類,因爲我無法找到它在道場1.8.3 CSS或JS:

d:\dev\js\dojo-release-1.8.3>findstr /i/s "dijithover" *.css 
FINDSTR: // ignored 

d:\dev\js\dojo-release-1.8.3>findstr /i/s "dijithover" *.js 
FINDSTR: // ignored 

,但我能找到dijitButtonHover

d:\dev\js\dojo-release-1.8.3>findstr /i/s "dijitbuttonhover" *.css 
FINDSTR: // ignored 
dijit\themes\claro\claro.css:.claro .dijitButtonHover .dijitButtonNode, 
dijit\themes\claro\claro.css:.dj_ie .claro .dijitToolbar .dijitButtonHover .dijitButtonNode, 
dijit\themes\claro\claro.css:.claro .dijitToolbar .dijitButtonHover .dijitButtonNode, 
dijit\themes\claro\form\Button.css:.claro .dijitButtonHover .dijitButtonNode, 
dijit\themes\claro\Toolbar.css:.dj_ie .claro .dijitToolbar .dijitButtonHover .dijitButtonNode, 
dijit\themes\claro\Toolbar.css:.claro .dijitToolbar .dijitButtonHover .dijitButtonNode, 
dijit\themes\nihilo\form\Button.css:.nihilo .dijitButtonHover .dijitButtonNode, 
dijit\themes\nihilo\nihilo.css:.nihilo .dijitButtonHover .dijitButtonNode, 
dijit\themes\nihilo\nihilo.css:.nihilo .dijitToolbar .dijitButtonHover, 
dijit\themes\nihilo\Toolbar.css:.nihilo .dijitToolbar .dijitButtonHover, 
dijit\themes\soria\form\Button.css:.soria .dijitButtonHover .dijitButtonNode, 
dijit\themes\soria\soria.css:.soria .dijitButtonHover .dijitButtonNode, 
dijit\themes\soria\soria.css:.soria .dijitToolbar .dijitButtonHover, 
dijit\themes\soria\Toolbar.css:.soria .dijitToolbar .dijitButtonHover, 
dijit\themes\tundra\form\Button.css:.tundra .dijitButtonHover .dijitButtonNode, 
dijit\themes\tundra\Toolbar.css:.tundra .dijitToolbar .dijitButtonHover, 
dijit\themes\tundra\tundra.css:.tundra .dijitButtonHover .dijitButtonNode, 
dijit\themes\tundra\tundra.css:.tundra .dijitToolbar .dijitButtonHover, 
dojox\grid\enhanced\resources\claro\EnhancedGrid.css:.dijitButtonHover .dojoxGridFBarCloseBtnIcon { 
dojox\grid\enhanced\resources\claro\EnhancedGrid.css:.dijitButtonHover .dojoxGridFCBoxRemoveCBoxBtnIcon { 
dojox\grid\enhanced\resources\claro\EnhancedGrid.css:.dijitButtonHover .dojoxGridFStatusTipDelRuleBtnIcon { 
dojox\grid\enhanced\resources\claro\EnhancedGrid.css:.claro .dojoxGridFBarInfoTD .dojoxGridFBarClearFilterBtn.dijitButtonHover .dijitButtonText { 
dojox\grid\enhanced\resources\claro\Filter.css:.claro .dojoxGridFBarInfoTD .dojoxGridFBarClearFilterBtn.dijitButtonHover .dijitButtonText { 
dojox\grid\enhanced\resources\claroEnhancedGrid.css:.dijitButtonHover .dojoxGridFBarCloseBtnIcon { 
dojox\grid\enhanced\resources\claroEnhancedGrid.css:.dijitButtonHover .dojoxGridFCBoxRemoveCBoxBtnIcon { 
dojox\grid\enhanced\resources\claroEnhancedGrid.css:.dijitButtonHover .dojoxGridFStatusTipDelRuleBtnIcon { 
dojox\grid\enhanced\resources\claroEnhancedGrid.css:.claro .dojoxGridFBarInfoTD .dojoxGridFBarClearFilterBtn.dijitButtonHover .dijitButtonText { 
dojox\grid\enhanced\resources\EnhancedGrid.css:.dijitButtonHover .dojoxGridFBarCloseBtnIcon { 
dojox\grid\enhanced\resources\EnhancedGrid.css:.dijitButtonHover .dojoxGridFCBoxRemoveCBoxBtnIcon { 
dojox\grid\enhanced\resources\EnhancedGrid.css:.dijitButtonHover .dojoxGridFStatusTipDelRuleBtnIcon { 
dojox\grid\enhanced\resources\Filter.css:.dijitButtonHover .dojoxGridFBarCloseBtnIcon { 
dojox\grid\enhanced\resources\Filter.css:.dijitButtonHover .dojoxGridFCBoxRemoveCBoxBtnIcon { 
dojox\grid\enhanced\resources\Filter.css:.dijitButtonHover .dojoxGridFStatusTipDelRuleBtnIcon { 
dojox\grid\enhanced\resources\tundra\EnhancedGrid.css:.dijitButtonHover .dojoxGridFBarCloseBtnIcon { 
dojox\grid\enhanced\resources\tundra\EnhancedGrid.css:.dijitButtonHover .dojoxGridFCBoxRemoveCBoxBtnIcon { 
dojox\grid\enhanced\resources\tundra\EnhancedGrid.css:.dijitButtonHover .dojoxGridFStatusTipDelRuleBtnIcon { 
dojox\grid\enhanced\resources\tundraEnhancedGrid.css:.dijitButtonHover .dojoxGridFBarCloseBtnIcon { 
dojox\grid\enhanced\resources\tundraEnhancedGrid.css:.dijitButtonHover .dojoxGridFCBoxRemoveCBoxBtnIcon { 
dojox\grid\enhanced\resources\tundraEnhancedGrid.css:.dijitButtonHover .dojoxGridFStatusTipDelRuleBtnIcon { 
dojox\layout\resources\RotatorContainer.css:.rotatorIcons .dijitButtonHover .previous{background-position:0 -16px;} 
dojox\layout\resources\RotatorContainer.css:.rotatorIcons .dijitButtonHover .next{background-position:-16px -16px;} 
0

道場按鈕具有的Html SPAN節點3個分級層。 只要鼠標進入按鈕,只有頂部的SPAN被改變。附加兩個CSS類:「dijitButtonHover」和「dijitHover」(如您在「無懸停」和「懸停」HTML標記中所示)。 要改變道場的Claro到自己的設計,當鼠標進入按鈕,嘗試CSS選擇器:

.claro .dijitReset.dijitInline.dijitButton.dijitButtonHover{} 

,如果你在你的CSS樣式表其他選擇有高的比重,這可能無法正常工作。如果是這種情況,請將一些CSS類添加到上面的選擇器中,以增加它的權重。