I have an HTML page in http://codepen.io/liang179/pen/WQvERK that contains a tag associated with a large data directory. There is overflow on the display in chrome. There is still data from screen.but. This is great in Firefox with a scroll bar. What can I do to make it appear in chrome with a scroll bar, like in Firefox. Below is the code.
$('#trigger').click(function(){ $class = "animated infinite " + $('#type').val(); $('#target').removeClass().addClass($class); });
<div style="text-align: center;"> <div id='target' style="margin: 200px auto; width: 200px; height:200px; background-color:#663399"></div> <div> <input id="type" list="classes"> <datalist id="classes"> <option value="bounce"> <option value="flash"> <option value="pulse"> <option value="rubberBand"> <option value="shake"> <option value="swing"> <option value="tada"> <option value="wobble"> <option value="jello"> <option value="bounceIn"> <option value="bounceInDown"> <option value="bounceInLeft"> <option value="bounceInRight"> <option value="bounceInUp"> <option value="bounceOut"> <option value="bounceOutDown"> <option value="bounceOutLeft"> <option value="bounceOutRight"> <option value="bounceOutUp"> <option value="fadeIn"> <option value="fadeInDown"> <option value="fadeInDownBig"> <option value="fadeInLeft"> <option value="fadeInLeftBig"> <option value="fadeInRight"> <option value="fadeInRightBig"> <option value="fadeInUp"> <option value="fadeInUpBig"> <option value="fadeOut"> <option value="fadeOutDown"> <option value="fadeOutDownBig"> <option value="fadeOutLeft"> <option value="fadeOutLeftBig"> <option value="fadeOutRight"> <option value="fadeOutRightBig"> <option value="fadeOutUp"> <option value="fadeOutUpBig"> <option value="flipInX"> <option value="flipInY"> <option value="flipOutX"> <option value="flipOutY"> <option value="lightSpeedIn"> <option value="lightSpeedOut"> <option value="rotateIn"> <option value="rotateInDownLeft"> <option value="rotateInDownRight"> <option value="rotateInUpLeft"> <option value="rotateInUpRight"> <option value="rotateOut"> <option value="rotateOutDownLeft"> <option value="rotateOutDownRight"> <option value="rotateOutUpLeft"> <option value="rotateOutUpRight"> <option value="hinge"> <option value="rollIn"> <option value="rollOut"> <option value="zoomIn"> <option value="zoomInDown"> <option value="zoomInLeft"> <option value="zoomInRight"> <option value="zoomInUp"> <option value="zoomOut"> <option value="zoomOutDown"> <option value="zoomOutLeft"> <option value="zoomOutRight"> <option value="zoomOutUp"> <option value="slideInDown"> <option value="slideInLeft"> <option value="slideInRight"> <option value="slideInUp"> <option value="slideOutDown"> <option value="slideOutLeft"> <option value="slideOutRight"> <option value="slideOutUp"> </datalist> <button id="trigger">Trigger</button> </div> </div> <script src="//cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>
source share