Блог

Я использую плагин «tooltipster», но я хотел бы сократить заголовок до 30 символов и добавить hellips.

У меня есть список из 3 ссылок. Ниже приведен код и добавлена ссылка на пример

 $('.tooltip').tooltipster({
    animation: 'fade',
    delay: 200,
    touchDevices: false,
    trigger: 'hover',
    position: 'bottom',
    theme: 'tooltipster-shadow'
});


$('.box a').each(function(){
    if ($(this).attr('title').text().length > 20) {
        $(this).attr('title').text($(this).text().substr(0, 17)); 
        $(this).attr('title').append(' ...');
    }

});
 

http://jsfiddle.net/rttUG/

большое вам спасибо!

1. Вы должны выполнять свои скрипты после того, как dom будет готов, использовать $(document).ready(function(){}) или $(function(){})
2. Чтобы получить значение атрибута, используйте $.attr('attribute') вместо $.attr('attribute').text()
3. Чтобы обновить значение атрибута, используйте $.attr('attribute', 'new value') вместо $.attr('attribute').text('new value')

Ваш новый код будет выглядеть следующим образом:

 $(function(){

    $('.box a').each(function(){
        var title = $(this).attr('title');
        if (title.length > 20) {
            $(this).attr('title', title.substr(0, 17)   '...'); 
        }
    })

    $('.tooltip').tooltipster({
        animation: 'fade',
        delay: 200,
        touchDevices: false,
        trigger: 'hover',
        position: 'bottom',
        theme: 'tooltipster-shadow'
    });

})
 

http://jsfiddle.net/8vpUk/