Page 1 of 1

Preview panel different from F12 view

Posted: Fri Oct 03, 2014 7:21 am
by click22
I have been exploring how to scroll the body of a table to a defined position with a button, using Jquery and javascript. Although the attached html file works as I expect when viewed using F12, it does not seem to work in the preview panel at the bottom of the main screen.

Code: Select all

<html lang="en">
  <meta charset="utf-8">
  <title>scrollTop demo</title>
  table.demo {
      display: table;
  table.demo thead, table.demo tbody {
      float: left;
      width: 100%;
  table.demo tbody {
      overflow: auto;
      height: 200px;
  <script src=""></script>
			var index = 15;
			var ht = 22;
			var offset = ht*(index-1);
    		$('#table1 > tbody').scrollTop(offset);
    	function jsfunction() { $('#table1 > tbody').scrollTop(6); } ;
<div align="center"><button id="scroll">Scroll</button>
<table id="table1" class="demo" width="200" border="1">
	<thead><tr><td>Column Heading</td></tr></thead>
	<tbody><tr><td>line 1</td></tr><tr><td>line 2</td></tr><tr><td>line 3</td></tr><tr><td>line 4</td></tr><tr><td>line 5</td></tr>
	<tr><td>line 6</td></tr><tr><td>line 7</td></tr><tr><td>line 8</td></tr><tr><td>line 9</td></tr><tr><td>line 10</td></tr>
	<tr><td>line 11</td></tr><tr><td>line 12</td></tr><tr><td>line 13</td></tr><tr><td>line 14</td></tr><tr><td>line 15</td></tr>
	<tr><td>line 16</td></tr><tr><td>line 17</td></tr><tr><td>line 18</td></tr><tr><td>line 19</td></tr><tr><td>line 20</td></tr>
	<tr><td>line 21</td></tr><tr><td>line 22</td></tr><tr><td>line 23</td></tr><tr><td>line 24</td></tr><tr><td>line 25</td></tr>

Am I missing something? I’m using the latest version of TopStyle ( with Windows 8.1 64 bit.