スクリーンショットは次のとおりです。
特定の実装コードは次のとおりです。
<％@ page Language = "c＃" autoeventwireup = "true" codefile = "default10.aspx.cs" default10 "％> <！doctype html public" - // w3c // dtd xhtml 1.0 transitional // en " "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> type = "text/javascript" src = "jquery 2.0.3.js"> </script> <style type = "text/css"> .highlighttextsearch {background-color：red; } a：hover {color：red; } .style2 {width：1000px; } .div {scrollbar-face-color：#dcdcdc; /*カーソルカラー*/ scrollbar-shadow-color：＃99bbe8; /*カーソルボーダーカラー*/ scrollbar-highlight-color：＃ff3300; /*カーソルハイライト*/ scrollbar-3dlight-color：＃9ebfe8; Scrollbar-Darkshadow-Color：＃9ebfe8; scrollbar-track-color：＃dfe8f6; /*スライドバーの背景色*/ scrollbar-arrow-color：＃6699ff; /*矢印の色*/} </style> </head> <body> <form id = "form1" runat = "server"> <div> <table align = "center" cellpadding = "0" cellpacing = "0"> <tr> <td align = "left" valign = "top"> <div style = "ovat; width：325px;背景 - "id =" movemodule "> </div id =" float：width：500px; align = "center"> </td> </tr> </table> </div> <script type = "text/javascript"> var isdown = false; var minwidth = 160; var maxwidth = 800; $（ "＃arrowborder"）。mousedown（function（）{this.setcapture（）; isdown = true; $（ "body"）。css（ "cursor"、 "e-resize"）;}）; $（ "body"）。mouseup（function（）{this.releasecapture（）; isdown = false; $（ "body"）。css（ "cursor"、 "default"）;}）; $（ "body"）。mousemove（function（event）{if（isdown）{var _mx = event.clientx; // var _my = event.clienty; var _poin = $（ "＃arrowborder"）。 _rw = $（ "＃redframe"）。 _W） （_lw -minwidth））; </script> </form> </body> </html>