• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

overflow

Status
Für weitere Antworten geschlossen.

Web_spider

Neues Mitglied
Hi all,
Ich bin überfragt in welchen Treath das muss, deswegen Poste ich es mal in Css, kann aber auch sein, dass das nur mit Javascript, php oder gar nicht lösbar ist :-(

Also: Ich habe 2 Boxen (divs) und die 1. Box ließt einen php Code , der Insgesamt länger ist, als die Box. Ich könnte ja jetzt overflow: hidden oder so machen, aber ich möchte das der "Rest" in die 2. Box geht. Also hier mal halbwegs deutlischer:
Box1: Box 2:
|----------------------------|##############|------------------------|
|Lorem ipsum************ |##############|Text soll hier weiter ****|
|Text aus der Datenbank ***|##############|gehen...************ *|
|auslesen... *************|##############|Text.. **************|
|Text....ist aber nicht zu Ende|##############|Text...zu Ende |*******|
|----------------------------|##############|------------------------|


Ich hoffe mir kann einer Helfen.

greez web_spider :D
 
okey xD
Also ich lese einen Text aus der Datenbank in eine div box aus, aber die Box ist zu klein, dass heißt ich kann dann in der Box scrollen. Ich möchte aber, dass der "rest" des Textes der nicht reinpasst in einer anderen Box weitergeht.

Das heißt box 1:
passen nur ca. 60 Zeilen rein.
Der Text ist aber 90 Zeilen lang.

gewünschtes Ergebniss.

60 Zeilen in Box 1
30 Zeilen in Box 2

greez web_spider :D
 
Mittels PHP könnte man sich die länge der Zeichenkette ausgeben lassen und dann sagen: "Zeige in der ersten Box Zeichen 1-100 und in der zweiten Box ab Zeichen 101".

Mit strlen() kann man sich die Länge einer Zeichenkette zurückgeben lassen.
Mit substr() kann man sich einen Teilstring aus einem String zurückgeben lassen.
 
ja, das Problem ist nur, ich arbeite mit height, und nicht mit der Länge des Strings...
kennt jemand noch eine andere Mglichkeit...

greez web_spider :D
 
Ich weiss es ist sehr umständlich, aber etwas anderes fällt mir so nicht ein

ausgabe.php
PHP:
<?php
//dieses Script liest den text aus der Datenbank
//und gibt es mit echo aus:
$connection = @mysql_connect("host","user","passwort");
@mysql_select_db("database");
$qry = "SELECT text FROM tablename WHERE id = 'x' LIMIT 1";
$sql = mysql_query($qry) 
         or die(mysql_errno()."<br>".mysql_error());
while ($row->mysql_fetch_row($sql))
{
    $ausgabe = $row->text;
}
echo $ausgabe;
?>

So diese Datei können wir nun mittels AJAX von einem anderen Dokument aufrufen lassen (AJAX = Asynchronous Javascript and XML).
Da dieses "Abrufen" durch JavaScript geschieht, können wir höhe der box (vermutlich <div>?! abfragen und den Text entsprechend anpassen)

das könnte so aussehen
HTML:
<html>
<head>
<script language=JavaScript type=text/javascript>
function getXmlHttpRequestObject() {
   if (window.XMLHttpRequest) {
      return new XMLHttpRequest();
   } else if(window.ActiveXObject) {
      return new ActiveXObject("Microsoft.XMLHTTP");
   } else {
   alert ("Cound not create XmlHttpRequest Object. Consider upgrading your browser.");
   }
}
var receiveReq = getXmlHttpRequestObject();
var buchstabenProZeile = 100;
var zeilenhoehe = 12;

if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
   receiveReq.open("GET", 'ausgabe.php', true);
   receiveReq.onreadystatechange = handleReceive;
   receiveReq.send(null);
}
function handleReceive()
{
   text = receiveReq.responseTEXT;
   document.getElementById('3').innerHTML = text;
   document.getElementById('3').style.display = 'block';
   height = document.getElementById('3').height;
   document.getElementById('3').innerHTML = null;
   document.getElementById('3').style.display = 'none';
   anzeige = height - document.getElementById('1').height;
   anzeige = (anzeige/zeilenhoehe)*buchstabenProZeile;
   anzeige1 = text.substring(0,(text.length-anzeige));
   getElementById('1').innerHTML = anzeige1;
   anzeige2 =text.substring((text.length-anzeige));
   getElementById('2').innerHTML = anzeige2;
}
</script>
</head>
<body>
<!-- BOX 1 -->
<div style="height:200px; float:left; border:1px solid black;" id ="1">

</div>
<!-- BOX 2 -->
<div style="height:200px; float:clear; border:1px solid black;" id ="2">

</div>
<!-- BOX 3 -->
<div style="display:hidden;" id ="3">

</div>
</body>
</html>

Naja leidlich zusammengeschustert. Ich denke du musst da noch einiges dran ändern damit es wirklich funktioniert.
Du musst noch
var buchstabenProZeile = 100;
var zeilenhoehe = 12;

Anpassen!

Hoffe es ist wenigsten ein Ansatz, wenn auch ein umständlicher.

(Ich glaube der Code ist nicht 100% ok - nicht getestet)
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben