【问题标题】:How to attach javascript scroll bar to textarea?如何将javascript滚动条附加到textarea?
【发布时间】:2013-04-15 00:53:37
【问题描述】:

我有一个 javascript 滚动条,它取代了普通的 webkit/mozilla 滚动条。只需输入 div 名称“.element”,它就可以在我的所有其他 div 上运行,但是我不确定如何让滚动条应用于文本区域?有谁知道我会怎么做,谢谢任何人的帮助。

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>

【问题讨论】:

    标签: javascript jquery css scroll


    【解决方案1】:

    此脚本将帮助您设置 tex 区域的样式; http://studio.radube.com/html-textarea-custom-scrollbar。它可以使用您自己的图像和 CSS 进行自定义。

    还可以查看这个 jQuery 插件:

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

    【讨论】:

      【解决方案2】:

      修改脚本如下:

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

      因为您的文本区域没有“bio”类的父元素。 您的选择器是错误的。更改选择器“textarea#bio”,将解决您的问题。

      如果它解决了您的问题,请接受答案。

      【讨论】:

        猜你喜欢
        • 2016-02-29
        • 1970-01-01
        • 2013-10-25
        • 1970-01-01
        • 2018-01-20
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2011-10-07
        相关资源
        最近更新 更多