2011-09-24 2 views
2

아래는 채팅 스크립트입니다. 스크롤 막대를 위로 끌려고하면 스크롤 막대가 아래로 당겨집니다. 내 아래 코드에서 드래그를 허용하는 방법.내 스크롤 막대를 끌 수 없습니다.

내 코드를 개선하고 스크롤을 허용하는 다른 방법이 있습니까?

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 코드 당신이 그것을 말하고있다 매 1 밀리 초이 div1의 하단으로 스크롤하기 때문에 작동하지 않습니다 귀하의 스크롤 (그건

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; 
     } 
    } 
} 
+0

내 대답이 도움이 되셨습니까? http://stackoverflow.com/questions/7538005/unable-to-drag-my-scroll-bar/7620173#7620173 –

답변

1

무엇을 당신의 _SetChatTextScrollPosition() 기능 않습니다). 시간 초과 대기 시간이 너무 짧기 때문에 스크롤바를 놓아 버리면 스크롤바가 다시 스크롤됩니다.

위로 스크롤 할 수있게하려면이 기능의 사용을 중지하거나 시간 초과 간격을 길게 설정하십시오 (밀리 초 단위이므로 1000 == 1 초). 적어도 스크롤하고 볼 수있는 기회가 있습니다.

+0

내 질문은 스크롤하는 방법입니다. 스크롤을 지연시키지 않습니다. 스크롤 막대는 업데이트 패널이 아닌 제 컨트롤에 있어야합니다. 채팅 메시지가 업데이트되지 않는 방식으로 타이머를 끄면 어떻게됩니까? – Mal

+1

서버 측 타이머를 멈추라는 말을하지 않았습니다. _SetChatTextScrollPosition 자바 스크립트 함수를 제거하는 중입니다. 모두 1 밀리 초마다 div의 위치를 ​​맨 아래로 설정합니다. 채팅 메시지를 업데이트하는 것과는 아무런 관련이 없습니다. 그리고 스크롤이 작동하지 않는 이유입니다. – patmortech

+0

내 스크롤 막대가 타이머 업데이트시 TOP로 재설정되는 것을 제거함으로써. : ( – Mal

2

브라우저 창이 현재 사용자에 의해 스크롤되고 있는지를 확인하는 것이 해결책이라고 생각합니다. 그렇다면 스크롤 위치를 설정하지 말고 다른 방법으로 div 요소를 스크롤하십시오.

자바 스크립트

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

희망 변경 변경합니다.

감사 및 감사

혹독한.

+0

가혹한 baid 이것은 나를 위해 작동하지 않았다. : – Mal

+0

당신은 당신의 자신의 해결책을 찾아 냈는가 ?? –

관련 문제