jQuery Plugin For Responsive Scrollable Text - adaptText
| File Size: | 184 KB |
|---|---|
| Views Total: | 1488 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
adaptText is a jQuery text plugin for responsive layout that automatically resizes the long text of your page to adapt the container/window's width. The plugin has the ability to add an ellipsis at the end of the overflowed text and make your long text scrollable when mouse hover over.
How to use it:
1. Include the jQuery javascript library and jQuery adaptText plugin at the end of your html page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="src/jquery-adapttext.js"></script>
2. Create your long text with scrollable support using data-scrollable attribute. You can pass more options to the long text by using the data-OPTIONS attributes, or by passing them in on initialization.
<h1 class="responsive" data-scrollable="true">Long Text With Scrollable Support</h1>
3. Initialize the plugin.
<script type="text/javascript">
$('.responsive').adaptText();
</script>
4. All the available options.
<script type="text/javascript">
$('.responsive').adaptText({
compression: 10,
max: Number.POSITIVE_INFINITY,
min: Number.NEGATIVE_INFINITY,
scrollable: false,
scrollSpeed: 1000,
scrollResetSpeed: 300,
onResizeEvent: true
});
</script>
Change log:
2017-09-11
- v1.3.4
2016-09-30
- v1.3.0: ES5 --> ES6
2014-09-06
- fix method call issue
v1.2.1 (2014-09-05)
- add throttle support
v1.2.0 (2014-05-15)
- update.
This awesome jQuery plugin is developed by amazingSurge. For more Advanced Usages, please check the demo page or visit the official website.











