無法拖動我的滾動條

以下是聊天腳本。當我嘗試拖動滾動條向下拉時。如何允許拖拽我的下面的代碼。無法拖動我的滾動條

是否有任何其他方式使我的代碼更好，並允許滾動。

的Default.aspx

<!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"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <div id="div1" style="height:400px; width:400px; overflow:auto; z-index:1"> 
      <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
      <asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick" /> 
      <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> 
      <Triggers> 
      <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" /> 
      </Triggers> 
      <ContentTemplate> 
       <div id="div2" style="height:300px; width:350px"> 
       <asp:BulletedList ID="BulletedList1" runat="server" /> 
       </div> 
       <div id="div4" style="position:absolute; left:500px; bottom:50px; z-index:10"> 
       <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" /> 
       </div> 
       </div> 
      </ContentTemplate> 
      </asp:UpdatePanel> 
      <div id="div5" style="position:absolute; left:100px; bottom:50px; z-index:10"> 
      <asp:TextBox ID="TextBox1" runat="server"/> 
      </div> 
    </form> 
    <script type="text/javascript"> 
     function _SetChatTextScrollPosition() { 
      var chatText = document.getElementById("div1"); 
      chatText.scrollTop = chatText.scrollHeight; 
      window.setTimeout("_SetChatTextScrollPosition()", 1); 
     } 

     window.onload = function() { 
      _SetChatTextScrollPosition(); 
     } 
     </script> 
</body> 
</html>

Server代碼

protected void Page_Load(object sender, EventArgs e) 
    { 

    } 
    protected void Timer1_Tick(object sender, EventArgs e) 
    { 
string MyConString = "DRIVER={MySQL ODBC 3.51 Driver};" + "SERVER=localhost;" + "DATABASE=chatserver;" + "UID=root;" + "PASSWORD=******;" + "OPTION=3"; 
     OdbcConnection MyConnection = new OdbcConnection(MyConString); 
     MyConnection.Open(); 
     OdbcCommand cmd = new OdbcCommand("Select message from shoutbox", MyConnection); 
     OdbcDataReader dr = cmd.ExecuteReader(); 
     ArrayList values = new ArrayList(); 
     while (dr.Read()) 
     { 
      string ep = dr[0].ToString(); 
      values.Add(new PositionData(ep)); 
      BulletedList1.DataSource = values; 
      BulletedList1.DataTextField = "Message"; 
      BulletedList1.DataBind(); 
     } 
    } 
    protected void Button1_Click(object sender, EventArgs e) 
    { 
     string MyConString = "DRIVER={MySQL ODBC 3.51 Driver};" + "SERVER=localhost;" + "DATABASE=chatserver;" + "UID=root;" + "PASSWORD=******;" + "OPTION=3"; 
     OdbcConnection MyConnection = new OdbcConnection(MyConString); 
     OdbcCommand cmd = new OdbcCommand("INSERT INTO shoutbox(name, message)VALUES(?, ?)", MyConnection); 
     cmd.Parameters.Add("@name", OdbcType.VarChar, 255).Value = "gimp"; 
     cmd.Parameters.Add("@message", OdbcType.Text).Value = TextBox1.Text; 
     MyConnection.Open(); 
     cmd.ExecuteNonQuery(); 
     MyConnection.Close(); 
    } 
} 
public class PositionData 
{ 
    private string name; 

    public PositionData(string name) 
    { 
     this.name = name; 
    } 

    public string Message 
    { 
     get 
     { 
      return name; 
     } 
    } 
}

來源

2011-09-24 Mal

我的回答對你有幫助嗎？ http://stackoverflow.com/questions/7538005/unable-to-drag-my-scroll-bar/7620173#7620173 –

您滾動不工作，因爲每隔1毫秒你告訴它滾動到你的DIV1的底部（這是你的_SetChatTextScrollPosition()功能一樣）。由於您的超時等待時間非常短，只要鬆開滾動條，就會再次將其向下滾動。因此，如果您想要向上滾動，您將不得不停止使用此函數，或者將超時間隔設置爲更長的時間（以毫秒爲單位，因此1000 == 1秒），以便您至少有機會滾動，然後再看它將你踢回底部。

來源

2011-09-26 14:58:27 patmortech

我的問題是如何滾動。不要延遲滾動。滾動條應完全在我的控制下，而不是更新面板。如果我關閉計時器聊天消息將不會更新？ – Mal

我沒有說停止你的服務器端計時器。我說要刪除_SetChatTextScrollPosition javascript函數。它所做的就是每隔1毫秒將div的位置設置到底部。它與更新聊天消息無關。這是你的滾動不起作用的原因。 – patmortech

通過刪除我的滾動條在計時器更新時重置爲TOP。 :( – Mal

我認爲解決方案將檢測瀏覽器窗口是否正在由用戶當前滾動。如果是，則不要設置滾動位置，否則請滾動div元素。

的Javascript改變

var isScrolling; 
document.observe('user:scrolling', function() { isScrolling = true; }); 

function _SetChatTextScrollPosition() { 
     if(!isScrolling) { 
      var chatText = document.getElementById("div1"); 
      chatText.scrollTop = chatText.scrollHeight; 
      window.setTimeout("_SetChatTextScrollPosition()", 1); 
     } 
     isScrolling = false; 
}

HTML改變

<body onscroll="document.fire('user:scrolling')">

Reference link to detect the browser being window scrolled

希望這有助於你。

謝謝，並問候

苛刻Baid。

來源

2011-10-01 12:20:27

沒有苛刻的Baid這不適合我。:( – Mal

你有沒有找到你自己的解決方案？ –

無法拖動我的滾動條

回答

相關問題