How to connect javascript scrollbar to textarea?

I have a javascript scrollbar that replaces the usual webkit / mozilla scrollbar. it works on all my other divs just by typing the div name “.element” but not sure how to make the scrollbar apply to the text area? Anyone know how I will do this, would appreciate help.

JAVASCRIPT:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script src="assets/js/scroll/jquery.mousewheel.min.js"></script>
<script src="assets/js/scroll/jquery.mCustomScrollbar.js"></script>

<script>
    (function($){
        $(window).load(function(){
            $(".bio textarea").mCustomScrollbar();
        });
    })(jQuery);
</script>

HTML:

<form action="includes/changebio.php" method="post" id="form1">         
 <textarea id="bio" style="width: 442px; 
    margin-top:3px;
    text-align:left;
    margin-left:-2px;
    height: 120px;
    resize: none; 
  outline:none;
    border: hidden;" textarea name="bio" data-id="bio" maxlength="710"><?php echo stripslashes($profile['bio']); ?></textarea>
<input type="image" src="assets/img/icons/save-edit.png"class="bio-submit" name="submit" value="submit" id="submit"/>
</form>
+5
source share
2 answers

This script will help you create a tex area; http://studio.radube.com/html-textarea-custom-scrollbar . It can be customized using your own images and CSS.

Also check out this jQuery plugin:

http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html

+1

script :

<script>
    (function($){
        $(window).load(function(){
            $("textarea#bio").mCustomScrollbar();
        });
    })(jQuery);
</script>

"bio" . . "textarea # bio", .

, .

0

All Articles