ckeditor - In der Klasse der Mutter Spanne von Symbolleiste auf die Schaltfläche

Question

Ich bin in der Lage Klasse auf die Schaltfläche hinzufügen:

editor.ui.addButton(_buttonName, 
      { 
       'label': 'Switch Toolbar', 
       icon: CKEDITOR.getUrl(this.path) + 'images/' + pluginIcon, 
       className: 'cke_switchtoolbar', 
       command: _pluginCommand 
      }); 

Aber ich will etwas Styling anwenden an ihre Mutter auch umspannt. Wie kann ich es tun. viele Spannweiten mit gleicher Klasse sein kann ‚cke_toolgroup‘ oder "

<span id="cke_403" class="cke_toolbar" aria-labelledby="cke_403_label" role="toolbar"> 
    <span id="cke_403_label" class="cke_voice_label">Expandable</span> 
    <span class="cke_toolbar_start"></span> 
    <span class="cke_toolgroup" role="presentation"> 
     <a id="cke_404" class="cke_switchtoolbar cke_button cke_button__switchbar cke_button_off cke_switchtoolbar" "="" href="javascript:void('Switch Toolbar')" title="Switch Toolbar" tabindex="-1" hidefocus="true" role="button" aria-labelledby="cke_404_label" aria-haspopup="false" onkeydown="return CKEDITOR.tools.callFunction(44,event);" onfocus="return CKEDITOR.tools.callFunction(45,event);" onmousedown="return CKEDITOR.tools.callFunction(46,event);" onclick="CKEDITOR.tools.callFunction(47,this);return false;"> 
      <span class="cke_button_icon cke_button__switchbar_icon" style="background-image:url(http://localhost:55244/Content/ckeditor/plugins/switchbar/images/arrow-downward.png?t=D08E);background-position:0 undefinedpx;">&nbsp;</span> 
      <span id="cke_404_label" class="cke_button_label cke_button__switchbar_label">Switch Toolbar</span> 
     </a> 
    </span> 
    <span class="cke_toolbar_end"></span> 
</span> 

In diesem Fall will ich Stile hinzufügen mit Klasse‚cke_toolgroup‘und Klasse‚cke_toolbar‘mit inneren Knopf mit Klasse‚cke_switchtoolbar‘aber, es zu überbrücken cke_toolbar '.

Answer 1

wenn der Klassenname Sie gab die Taste eindeutig zuzuordnen sind, können Sie einige Jquery verwenden Styling zu ändern, nachdem Sie benutzerdefinierte Schaltfläche zu CKEditor Symbolleiste wie folgt hinzugefügt:

$(".cke_toolbar").closets("span").addClass(yourClass); 

der closest("span") Teil findet am nächsten Elternteil, das ist Spanne, Sie können einen anderen Selektor verwenden, wenn Sie möchten.

Answer 2

Sie können auch Eltern Spannweite mit CSS wie #cke_1_top .cke_toolbox span:last-child oder #cke_1_top .cke_toolbox span:nth-child(n)

#cke_1_top ist eine Hauptmutter Spannweite und .cke_toolbox wickeln alle Symbolleiste Spannweite, mit beiden Spanne Ziel Sie jedes Kind Spanne Ziel kann