Clicking on the "setActiveView" button will change the active view to the second child.
( See JS tab )
<p>Clicking on the "setActiveView" button will change the active view to the second child. <br>( See JS tab )</p> <ch5-triggerview id="demo"> <ch5-triggerview-child> <div class="viewcontent"> <h1>First View</h1> </div> </ch5-triggerview-child> <ch5-triggerview-child> <div class="viewcontent"> <h1>Second View</h1> </div> </ch5-triggerview-child> <ch5-triggerview-child> <div class="viewcontent"> <h1>Third View</h1> </div> </ch5-triggerview-child> </ch5-triggerview> <br> <ch5-button id="button" label="setActiveView"></ch5-button>
var demo = document.getElementById('demo'); var button = document.getElementById('button'); button.addEventListener('click', function() { demo.setActiveView(2); });
.viewcontent { width:100%; height:200px; background: #999; display: table; } .viewcontent h1 { text-align: center; vertical-align: middle; display:table-cell; }