[js]Dzielenie tekstu na kolumny Opcje

[sleedz]

Witam.
Mam taki problem że mam kolumny ograniczone wysokością i potrzebuję podzielić tekst tak aby nie wystawał na dół. Można to zrobić ograniczając ilość znaków, tylko że różne znaki mają różną szerokość więc nie da się określić stałej ilości.
Nie mam żadnego pomysłu jak to rozwiązać.

Ten post edytował sleedz 26.10.2011, 20:26:57

[by_ikar]

Nie musi być js, może być css. A konkretniej: display: hidden; nadaj konkretnej kolumnie, jeżeli tekstu będzie więcej niż się może zmieścić, zostanie zwyczajnie obcięty

[sleedz]

Ale wtedy go po prostu zasłoni a ja chcę żeby go przeniosło do następnej kolumny.

[Sephirus]

Ok to jest jakiś pomysł ale trzeba go sprawdzić w praktyce... i nie jest idealny...

zobacz

[sleedz]

Napisałem coś takiego, ale jak mam tekstu na jedną kolumnę to nie działa i nie wiem co zrobić.
Mógłbym mi ktoś pomóc? Z góry dziękuję.

[JAVASCRIPT] pobierz, plaintext 
function cols(div_id, ii, col1, col2) { 
             var $div = $('#'+div_id+'1'); 
             if(ii==2) var $div2 = $('#'+div_id+'2'); 
             var orgWys =
                parseInt($div.css('height')); 
            var next_col = "";
             $div.css('height', 'auto'); 
 
             var tekst = new Array();
             var a ="";
             var j = 0;
			 var i = 10;
             col1 = 0;
             col2 = 1;
             while(i>0) {
		 var slowa = $div.html().split(' '); 
             	 var ilosc = slowa.length; 
                 if ($div.height() > orgWys) { 
 
                     var indeks = slowa.length; 
                     do { 
                         a = slowa.slice(0, --indeks).join(' ')
                         $div.html(a); 
 
                     } while ($div.height() > orgWys);
 
                 } 
                 tekst[j] = $div.html();
                 next_col = slowa.slice(indeks, ilosc).join(' ');
                 $div.html(next_col);
 
 
		if(tekst[j].length == 0) i = 0;
		j++
 
 
             }
             var l = tekst.length;
             $div.css('height', orgWys); 
             if(l>1) {
             if(ii==2) {
                 var sites = roundUp((l-1)/2)
                 var li = '';
                 var site = 1;
 
                 for(var i=1; i<=sites; i++) {
                     if(i==site) li += "<li class=\"active\" id=\"s"+i+"\">"+i+"</li>";
                     else li += "<li id=\"s"+i+"\">"+i+"</li>";
                 }
                  $("#page_buttons ul").html(li);
 
                 for(var k=1; k<=sites; k++) {
                     $("#s"+k).click(
                            function() {
                               var id = this.id.split('');
                               site = id[1];
                               var c1 = roundUp((site*2)-2);
                               var c2 = roundUp((site*2)-1);
                               $div.html(tekst[c1]);
                               $div2.html(tekst[c2]);
                               $("#page_buttons ul").children("li").removeClass();
                               $(this).addClass("active");
                         });
                 }
 
                 $div.html(tekst[col1]);
                 $div2.html(tekst[col2]);
             }
             if(ii==1) {
                 var sites = roundUp(l-1)
                 var li = '';
                 var site = 1;
 
                 for(var i=1; i<=sites; i++) {
                     if(i==site) li += "<li class=\"active\" id=\"s"+i+"\">"+i+"</li>";
                     else li += "<li id=\"s"+i+"\">"+i+"</li>";
                 }
                  $("#page_buttons ul").html(li);
 
                 for(var k=1; k<=sites; k++) {
                     $("#s"+k).click(
                            function() {
                               var id = this.id.split('');
                               site = id[1];
                               var c1 = site-1;
                               $div.html("<div id=\"dc1text\">"+tekst[c1]);
                               $("#page_buttons ul").children("li").removeClass();
                               $(this).addClass("active");
                         });
                 }
 
                 $div.html(tekst[col1]);
             }
             }
 
         }
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował sleedz 3.11.2011, 19:20:56