:first-word.
:first-lettera
:first-linek dispozici je, ale
:first-worldse musí obejít. Dobré tipy jsem našel na Stack Overflow v článku CSS to increase size of first word. Konstrukce pro jQuery
$('#links a').each(function(){
var me = $(this);
me.html( me.text().replace(/(^\w+)/,'<strong>$1</strong>') );
});
případně
$('#links a').each(function(){
var me = $(this),
t = me.text().split(' ');
me.html( '<strong>'+t.shift()+'</strong> '+t.join(' ') );
});
se mi docela líbí. Nicméně jsem kód ještě potřeboval upravit tak, aby uměl zvýraznit "první slovo" v nadpisech, které mohou, ale nemusejí, obsahovat odkaz nebo i jiné tagy (proto hledání
*= jakéhokoliv zanořeného tagu), s mezerami to není tak jednoznačné (proto regulární výraz jako argument funkce split) a když by těch
prvních slovbylo víc... (proto ta varianta s polem):
$('h2, h3').each(function(){
var c = $(this),
a = c.find('*').first(),
s;
if ( a.length ){
c = a;
}
s = c.html().split(/\s+/);
c.html( '<strong>' + s.splice(0, Math.round(s.length/2)).join(' ') + '</strong>' + (s.length ? ' ' + s.join(' ') : '') );
});
Použití
floormísto
Rounddá trochu jiné výsledky. I když kód není zdaleka neprůstřelný, v mém případě funguje dostatečně správně.