1 $(document).ready(function(){ 2 $('.box').mousedown(function(){ 3 $(this).bind('mousemove', function(e){ 4 if(e.target.tagName=="A"){ 5 location.hash = e.target.getAttribute('href') 6 } 7 }) 8 $(document).mouseup(function(){ 9 $('.box').unbind('mousemove'); 10 }); 11 }) 12 });
1 <div class="box"> 2 <a href="#p10" class="a0">p10</a> 3 <a href="#p11" class="a1">p11</a> 4 <a href="#p12" class="a2">p12</a> 5 <a href="#p13" class="a3">p13</a> 6 <a href="#p14" class="a4">p14</a> 7 <a href="#p15" class="a5">p15</a> 8 <a href="#p16" class="a6">p16</a> 9 </div> 10 <div class="d1"> 11 <div class="d2"> 12 <p>001</p> 13 <p>002</p> 14 <p>003</p> 15 <p>004</p> 16 <p>005</p> 17 <p>006</p> 18 <p>007</p> 19 <p>008</p> 20 <p>009</p> 21 <p><a name="p10">010</a></p> 22 <p><a name="p11">011</a></p> 23 <p><a name="p12">012</a></p> 24 <p><a name="p13">013</a></p> 25 <p><a name="p14">014</a></p> 26 <p><a name="p15">015</a></p> 27 <p><a name="p16">016</a></p> 28 <p>017</p> 29 <p>018</p> 30 <p>019</p> 31 <p>020</p> 32 <p>021</p> 33 <p>022</p> 34 <p>023</p> 35 <p>024</p> 36 <p>025</p> 37 <p>026</p> 38 <p>027</p> 39 <p>028</p> 40 <p>029</p> 41 <p>030</p> 42 <p>031</p> 43 <p>032</p> 44 <p>033</p> 45 <p>034</p> 46 <p>035</p> 47 <p>036</p> 48 <p>037</p> 49 <p>038</p> 50 <p>039</p> 51 <p>040</p> 52 <p>041</p> 53 <p>042</p> 54 <p>043</p> 55 <p>044</p> 56 <p>045</p> 57 <p>046</p> 58 <p>047</p> 59 <p>048</p> 60 <p>049</p> 61 <p>050</p> 62 <p>051</p> 63 <p>052</p> 64 <p>053</p> 65 <p>054</p> 66 <p>055</p> 67 <p>056</p> 68 <p>057</p> 69 <p>058</p> 70 <p>059</p> 71 <p>060</p> 72 <p>061</p> 73 <p>062</p> 74 <p>063</p> 75 <p>064</p> 76 <p>065</p> 77 <p>066</p> 78 <p>067</p> 79 <p>068</p> 80 <p>069</p> 81 <p>070</p> 82 <p>071</p> 83 <p>072</p> 84 <p>073</p> 85 <p>074</p> 86 <p>075</p> 87 <p>076</p> 88 <p>077</p> 89 <p>078</p> 90 <p>079</p> 91 <p>080</p> 92 <p>081</p> 93 <p>082</p> 94 <p>083</p> 95 <p>084</p> 96 <p>085</p> 97 <p>086</p> 98 <p>087</p> 99 <p>088</p> 100 <p>089</p> 101 <p>090</p> 102 <p>091</p> 103 <p>092</p> 104 <p>093</p> 105 <p>094</p> 106 <p>095</p> 107 <p>096</p> 108 <p>097</p> 109 <p>098</p> 110 <p>099</p> 111 <p>100</p> 112 </div> 113 </div>
1 .box { 2 position: fixed; 3 left: 600px; 4 top: 0; 5 padding: 20px; 6 border: 1px solid #ddd; 7 a { 8 display: block; 9 } 10 } 11 .d1 { 12 400px; 13 height: 400px; 14 padding: 100px; 15 background-color: #09f; 16 position: relative; 17 .d2 { 18 100%; 19 height: 100%; 20 overflow-y: auto; 21 background-color: #f30; 22 p{ 23 height: 20px; 24 line-height: 20px; 25 } 26 } 27 }