jeffchan / truncate.js

fast, intelligent javascript text truncation
MIT License
98 stars 45 forks source link

Mobile Issue - When scrolling after expanding text, the text collapses #13

Open JordanSayner opened 9 years ago

JordanSayner commented 9 years ago

Hi,

Im trying to use this in a responsive way. I tried writing my own but failed.

basically, on Both Android 5.0 and IOS 5+ (the devices i have on hand currently). When the text has bee expanded, and you scroll down past theexpanded text, it auto collapses again. My code is below

function truncateText() {
    $('.truncate-wrapper').truncate({
        lines: 14,
        lineHeight: 20
    });

    if ($(window).width() < 785) {
        $(".m-read-more").show()
        $('.truncate-wrapper').truncate('collapse');
    } else {
        $(".m-read-more").hide()
        $('.truncate-wrapper').truncate('expand');
    }
}

This is fired on document ready using the code below

    if ($('.truncate-wrapper').length) {
        truncateText();
        $(window).on('resize', function (event) {
            truncateText();
        })
    }

    $(".m-read-more").bind(strClick, function (e) {
        $('.truncate-wrapper').truncate('expand');
        $(this).hide();
        e.preventDefault();
    });

Here is an example of what i mean. http://jsfiddle.net/8gjunbdL/1/ i have checked it on my samsung Galaxy s5 and still getting the bug within this test enviroment.

D0cNet commented 8 years ago

Hi, I get the same issue for my mobile browsers, across iPhone safari & chrome and galaxy chrome ..etc Any fix available?

Tuizi commented 8 years ago

Not know fix for that. We will check that and fix it.