Home/ Questions/Q 6152239
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T19:53:11+00:00

We are using scrollpane.js for scrolling <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtd> <html>

  • 0

We are using scrollpane.js for scrolling

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Youngib Command Line Test</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js" type="text/javascript"></script>
        <script src="js/scrollpane.js" type="text/javascript"></script>

        <link rel="stylesheet" href="css/jquery.jscrollpane.css" type="text/css" />
        <style>
    #data
    {
      width: 500px;
      height: 200px;
      overflow: auto;
      float:left;
    };
    .scroll1{
      float:left;
    }
        </style>
    <script>
    $(function(){
    var api = $('.scroll').jScrollPane(
                    {
                        showArrows:true,
                        maintainPosition: false
                    }
                ).data('jsp');
    $("#button").click(function(){
      alert("here i want to append into data div ");
     //  var scroll=$('.scroll').jScrollPane();
      api.getContentPane().append('<p>radfsf Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>');
    });
        api.reinitialise();
  });
    </script>
</head>
<body>
<div id="data" class="scroll">
<p>
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Vestibulum dictum consectetur magna eu egestas. Praesent molestie dapibus erat, sit amet sodales lectus congue ut. Nam adipiscing, tortor ac blandit egestas, lorem ligula posuere ipsum, nec faucibus nisl enim eu purus. Quisque bibendum diam quis nunc eleifend at molestie libero tincidunt. Quisque tincidunt sapien a sapien pellentesque consequat. Mauris adipiscing venenatis augue ut tempor. Donec auctor mattis quam quis aliquam. Nullam ultrices erat in dolor pharetra bibendum. Suspendisse eget odio ut libero imperdiet rhoncus. Curabitur aliquet, ipsum sit amet aliquet varius, est urna ullamcorper magna, sed eleifend libero nunc non erat. Vivamus semper turpis ac turpis volutpat non cursus velit aliquam. Fusce id tortor id sapien porta egestas. Nulla venenatis luctus liber

consectetur adipiscing elit.
</p>
</div>
<div id="data" class="scroll1">
</br>
</br>
</br>
</br>
</br>
</br>
<input id="button" value="button" type="button">
</div>
</body>
</html>

it is appending the p tag but scrolling is not working with the appended div.
Please suggest what to do for proper scrolling.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Please try this

    <script>
    $(function(){
    var api = $('.scroll').jScrollPane(
                    {
                        showArrows:true,
                        maintainPosition: false
                    }
                ).data('jsp');
    $("#button").click(function(){
      alert("here i want to append into data div ");
     //  var scroll=$('.scroll').jScrollPane();
      api.getContentPane().append('<p>...</p>');
      $('.scroll').jScrollPane(
                    {
                        showArrows:true,
                        maintainPosition: false
                    }
                )
    });
  });
    </script>
    • 0