SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question maintaining scrollbar position

    Hi,

    I have a problem with a <select> item performing like a list box, this listbox display a dynamic list of items to the user. part of this page contains java script that apon the click of a button can move selected items up and down the list as appropriate.

    As a result of the list of items being dynamic the list can grow larger than the visable area which results in a scrollbar beign displayed. when this happens the javascript still works correctly but causes the scroll position to move to the top position so u are unable to see the item has moved without scrolling down.

    Is there a simple way to maintain the scroll bar position as part of the javascript.

    the following script is used to move items up and down.

    Code:
    <script language=JavaScript>
    function up(obj) { 
    obj = (typeof obj == "string") ? document.getElementById(obj) : obj; 
    if (obj.tagName.toLowerCase() != "select" && obj.length < 2) 
    return false; 
    var sel = new Array(); 
    for (var i=0; i<obj.length; i++) { 
    if (obj[i].selected == true) { 
    sel[sel.length] = i; 
    } 
    } 
    for (i in sel) { 
    if (sel[i] != 0 && !obj[sel[i]-1].selected) { 
    var tmp = new Array((document.body.innerHTML ? obj[sel[i]-1].innerHTML : obj[sel[i]-1].text), obj[sel[i]-1].value, obj[sel[i]-1].style.color, obj[sel[i]-1].style.backgroundColor, obj[sel[i]-1].className, obj[sel[i]-1].id); 
    if (document.body.innerHTML) obj[sel[i]-1].innerHTML = obj[sel[i]].innerHTML; 
    else obj[sel[i]-1].text = obj[sel[i]].text; 
    obj[sel[i]-1].value = obj[sel[i]].value; 
    obj[sel[i]-1].style.color = obj[sel[i]].style.color; 
    obj[sel[i]-1].style.backgroundColor = obj[sel[i]].style.backgroundColor; 
    obj[sel[i]-1].className = obj[sel[i]].className; 
    obj[sel[i]-1].id = obj[sel[i]].id; 
    if (document.body.innerHTML) obj[sel[i]].innerHTML = tmp[0]; 
    else obj[sel[i]].text = tmp[0]; 
    obj[sel[i]].value = tmp[1]; 
    obj[sel[i]].style.color = tmp[2]; 
    obj[sel[i]].style.backgroundColor = tmp[3]; 
    obj[sel[i]].className = tmp[4]; 
    obj[sel[i]].id = tmp[5]; 
    obj[sel[i]-1].selected = true; 
    obj[sel[i]].selected = false; 
    } 
    } 
    return false;
    } 
    </script>
    Any pointers into stuff i can look into would be wonderful.

    Cheers

  2. #2
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,097
    Mentioned
    153 Post(s)
    Tagged
    3 Thread(s)
    There is javascript method scrollBy, but that doesn't work on <select>'s (only on window objects I guess).

    However, I found a solution for you here

    Good luck

  3. #3
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, i will have a look at getting it working later.

  4. #4
    SitePoint Member
    Join Date
    Aug 2008
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks again for the response, after havign a look at the code i have noticed that all it is doing is selecting the item but at the bottom of the script i use it does exactly this.

    Any 1 got any other suggestions or am i missing somthing with the solution already suggested.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •