Zum Inhalt springen
View in the app

A better way to browse. Learn more.

Fachinformatiker.de

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Css auf Monitor Auflösung anpassen

Empfohlene Antworten

Hallo,

ich habe eine Internetseite gebastelt die uach soweit recht gut aussieht, nun möchte ich aber gerne das die seite bei einer höheren auflösung eine größere max.height bekommt als bei einer kleinen auflösung...

ich meine das sollte möglich sein oder? nur wie ?

vielen dank schonma..

Es gibt da eine Möglichkeit so etwas per Javascript zu berechnen. Allerdings weiß ich das auch nicht genau wie das geht. Kannst ja einmal bisschen googlen.

ich will ja nicht die weiter ändern sondern nur die höhe...

jetzt sind die angaben in px...

#Content

{

float:left;

width: 580px;

width: 580px !important;

min-height: 440px;

min-height: 440px !important ;

height: 440px !important;

position:relative;

overflow-y: scroll;

cursor:hand;

clip:rect |auto;

}

#SideBar

{

width: 217px !important;

width: 216px;

min-height: 440px;

min-height: 440px !important;

height: 440px !important;

left:580px;

margin-top:0px auto;

top: 159px;


<html>
<title></title>
<head>
<script language="JavaScript">
function aufloesung() {
var hoehe=screen.height;
var breite=screen.width;
if (breite >= '600' && breite <= '800') { window.open("800600/800.htm","_blank","height=600,width=800"); }
else
{
if (hoehe >= '800' && breite <= '1024') {window.open("1024/index.htm","_blank","height=800,width=1024");}
else
{window.open("else/else.htm","_blank","height=500,width=500");}
}
}
</script>
</head>
<body onload="aufloesung()">
</body>
</html>
[/PHP]

Schau, wenn du dies in deine Index-Seite einbindest, könntest du so auf eine neue Seite mit der jeweilige Auflösung verlinken. In der verlinkten Seite könntest du dann dir ja eine extra Style-File (uiii, is das n stylischer name^^) anhängen.

---------------------------------------------

Würd mich nicht wundern wenn du allerdings auch einfach per Javascript direkt die neue Style-File laden kannst. Nur bin ich nicht der Javascript-Könner...

daraus werd ich nicht ganz schlau?

die seite beruht auf aspx und die startseite ist eine mastersite dem eine css eingebunden wird.

wie mache ich das dann mit dem javascribt?

ist das nicht einfach möglich in der css ezu ändern?

vielen dank

Das denk ich ist es bestimmt.... nur weis ich es eben nicht^^.

Aber nach meiner Theorie kannst du es so aufbauen:

:mod:

Du baust eine Seite auf, die nur dazu dient, die Auflösung des Clienten auszurechen. Dies kannst du mit dem obenstehenden javascript bewältigen.

-------------------------------------------------

Wenn die Auflösung berechnet wurde linkt die 1. Seite weiter auf eine neue Seite. Für jede Auflösung muss dies eine eigene Seite sein. Allerdings kann der Inhalt der neuen Seite komplett gleich bleiben, bis auf die css Datei, die muss jedesmal verändert werden.

-------------------------------------------------

Ich weiß nicht, vielleicht geht das ganze auch deutlich einfacher, aber immerhin müsste es so funktionieren.

aber das ist nun auchd as problem...

somit müsste ich zwei css dateien haben aber bei meinem content managementsystem muss ich beim erstellen einer unterseite eine css datei auswählen, somit ist die fest dadrin.

also mit 2 verschiedenen css dateien würde ich es auch machen aber ich weiß nicht wie das unser system bewältigen soll!?

achso:

sitefinity heißt unser system

also mit 2 verschiedenen css dateien würde ich es auch machen aber ich weiß nicht wie das unser system bewältigen soll!?

Es ist definitiv nicht möglich, das CSS zur Laufzeit an die Auflösung anzupassen (dafür gibt es relative Angaben). Ok, das stimmt so natürlich nicht ganz. Über ein Javascript kannst du das problemlos machen. Und nicht nur so komisch über eine Portalseite, die dann per PopUp (iiiih) die eigentliche Seite öffnet ;)


var myObj = document.getElementById("SideBar");

myObj.style.height = "500 px";

Aber das kannst du natürlich nur tun, wenn zur Laufzeit des Javascripts das Dokument schon aufgebaut ist und das Element mit der ID SideBar auch besitzt. Sprich onload. Das heißt aber auch, dass deine Seite erst mit Höhe 1 aufgebaut wird, und dann die Höhe auf Höhe 2 geändert, was unschön aussehen kann. Und stylistisch auch sehr unschön ist. Und noch unschöner das zu pflegen.

Wie ich das verstehen, hast du 2 Boxen, eine Sidebar und ein Content. Die Sidebar ist aber nie hoch genug, sondern nur so hoch wie der Inhalt. Altbekanntes Problem ;)

Das Problem dabei ist, dass das Document keine Höhe hat, also es ist nicht so hoch wie das Browserfenster, aus dem Grund, da das Dokument mit dem Viewport (dem Anzeigeelement) nichts zu tun hat. Eine relative Größe ist damit also nciht zu machen.

Was du machen könntest wäre: Eine Box um die beiden Boxen rum, und die Sidebar auf height = 100%. Die height bezieht sich immer auf das Elternelement, also die Box um die beiden Boxen in dem Fall. Somit ist deine Sidebar immer mindestens so hoch wie die Contentbox. Und wenn du eben mal weniger Inhalt hast, dann kannst du da eine kleine Box mit Höhe X Pixel reinpacken um das auszugleichen. Also damit alle Inhalte praktisch dieselbe (mindest) Höhe haben. Dann vergrößert sich deine Box bei Bedarf nach unten, aber hat eine Mindesthöhe. Und deine Sidebar ist immer so hoch wie der Inhalt.

Was willst du eigentlich mit der Bildschirmauflösung anfangen? Ich zum Beispiel surfe nie im Vollbild. Merke: Auflösung!=Viewport.

Warum erstellst du nicht gleich eine flexible Seite? Das ist doch das schöne an HTML: es passt sich in der Regel wunderbar an den Platz an, den es zur Verfügung hat.

Archiv

Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.