Narwhals Playing Mahjong

    textcliper

    0.0.4 • Public • Published

    textcliper

    Multiple lines of text ellipsis

    Getting Started

    HTML:

      <div id="app">
        Test Something ! <span>label</span><span>label2</span>
      </div>

    CSS:

      #app {
        width: 100px
      }

    JavaScript:

      var app = document.getElementById('app')
     
      TextCliper.clip(app, 1)

    Result:

      <div id="app" style="word-wrap: break-word;">
          Test Something ! <span>l...</span>
      </div>

    Installing

    Using NPM:

      npm install textcliper --save

    Using CDN:

    <script type="text/javascript" src="//unpkg.com/textcliper"></script>

    API

      // using cdn
      var app = document.getElementById('app')
     
      TextCliper.clip(app, 1)
     
      // or using npm
      import TextCliper from 'textcliper'
     
      TextCliper.clip(app, 1)
     
      // or vue plugin, if you use Vue
      import TextCliper from 'textcliper'
      Vue.use(TextCliper)
     
      // vue instance method
      this.$textclip(1)
     
      // vue directive
      <div v-textclip="1"> Test Something ! <span>label</span><span>label2</span> </div>

    TextCliper

    a TextCliper instance

    TextCliper.clip(ele, options [, lines])

    ele : target dom element.

    options: when it is a number, it indicates the number of rows ellipsis.

    options.lines: specifies the number of rows to ellipsis. options.sign: ellipsis symbol, the default is ....

    License

    This project is licensed under the MIT License - see the LICENSE file for details

    Install

    npm i textcliper

    DownloadsWeekly Downloads

    1

    Version

    0.0.4

    License

    MIT

    Unpacked Size

    19.1 kB

    Total Files

    19

    Last publish

    Collaborators

    • yoring