javascript - 通过使用鼠标拖动来滚动文本

Question

我正在尝试创建一个具有特定宽度和高度的文本 block 。如果文本超出宽度和高度，我希望能够拖动文本并显示其余内容。 (按下文本并向左或向右移动文本)。当我现在这样做时，它会选择文本而不是拖动它。我已经看到一些网站使用 flash 来实现它，但是必须有一种更简单的方法来使用 CSS 或 jQuery 来实现它。

Answer 1

给你，你可以使用 Jquery UI 的 draggable() 来拖动文本

HTML

<div id="container">
         <p>
          "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod                                                        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud       exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
        </p>
     </div>

CSS

          div{

               width:150px;
               height:150px;
               overflow:hidden;
               border:1px solid grey;

             }

Jquery--

                var o = document.getElementById("container");

                if (o.offsetHeight < o.scrollHeight) {

                   $('p').on('click',function(){
                   $(this).css("cursor","move");
                   $(this).draggable();
                   });

                 }

Check the Fiddle Here