pxkw.hatenadiary.com

めもめも

js

トグる2

クリックでtdの表示をトグる <div id="slide-toggle-sample1"> <table> <tr > <td> <div id="trigger">Click me to show msg</div> <div id="message" style="display:none" >Can you see me?</div> </td> </tr> </table> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <script> $(function(){ $("#trigger").cl…</div>

trをslideToggleする

<div id="trSlideToggleSample"> <table> <tr class="trTrigger"> <th colspan="2">Click me to show.</th> </tr> <tr style="display:none"> <th>Can you</th> <td>see me?</td> </tr> </table> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <script> $(function(){ $(".trTrigger").click( funct…</div>

dlをslideToggleする

参考: 超簡単jQuery!"toggle系メソッド"を使ってアコーディオンメニューやタブをさくっと実装する方法 | 株式会社LIGミニマルなコードはこんな感じかな <div id="dlSlideToggleSample"> <dl> <dt class="trigger">Click me to show/hide item.</dt> <dd style="display:none"> Can you see me?</dd> </dl> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <script>…</div>

Text in oval

こーすると <div id="div_tio" ><div> <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> <script type="text/javascript"> var dataset = [ {'name':'v1', 'x':1, 'y':0}, {'name':'v2', 'x':2, 'y':0}, {'name':'v3', 'x':3, 'y':0}, {'name':'v4', 'x':4, 'y':0}, {'name':'v5', 'x':5, 'y':0}, {'name'…</div></div>

D3でbuttonを追加する

こうすると <div id="d_button"></div> <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> <script type="text/javascript"> var dataset = [ 1,2,3,4,5 ]; function onButtonClicked( ){ var text = '(name,value)=(' + this.name + ',' + this.value + ')'; alert( text ); }; d3.select('#d_button') .s…

D3のenterとupdateとexitについて

js d3

The empty selection is joined to data: data(data). The data method binds data to elements, producing three virtual selections: enter, update and exit. The enter selection contains placeholders for any missing elements. The update selection…