textfill voor een class

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Joep de Jong

Joep de Jong

05/04/2014 12:13:47
Quote Anchor link
Hallo allemaal,

Op mijn site heb ik verschillende div's met tekst,
ik wil graag dat de tekst, aan de hand van textfill of een andere manier, aangepast wordt aan de grote van de div waar de tekst in staat.
Het volgende script werkt:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
;(function($) {
    $.fn.textfill = function(options) {
        var fontSize = options.maxFontPixels;
        var ourText = $('p:visible:first', this);
        var maxHeight = $(this).height();
        var maxWidth = $(this).width();
        var textHeight;
        var textWidth;
        do {
            ourText.css('font-size', fontSize);
            textHeight = ourText.height();
            textWidth = ourText.width();
            fontSize = fontSize - 1;
        } while ((textHeight > maxHeight || textWidth > maxWidth) && fontSize > 3);
        return this;
    }
})(jQuery);
$(document).ready(function(){

    $('#mm1').textfill({ maxFontPixels: 100 });
});


In dit geval is #mm1 één van de div's waarvan ik de tekstgrootte wil aanpassen.
Zodra ik echter in plaats van '#mm1' '.mm' gebruik komt alle tekst in het formaat van de als eerst benoemde div in het html script.

Hoe kan ik dit oplossen?

Met vriendelijke groet,
Joep.
 
PHP hulp

PHP hulp

29/03/2024 15:28:46
 
Joep de Jong

Joep de Jong

06/04/2014 12:37:53
Quote Anchor link
 
Kumkwat Trender

Kumkwat Trender

06/04/2014 13:05:20
Quote Anchor link
$(".mm").each(function() {
$(this).textfill({ maxFontPixels: 100 });
});
 
Joep de Jong

Joep de Jong

06/04/2014 13:12:07
Quote Anchor link
Bedankt! Ik zal het zo even proberen.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.