Antworten auf deine Fragen:
Neues Thema erstellen

DIV-Container soll ab bestimmter Bildschirmauflösung verschwinden

ezekiel23

Nicht mehr ganz neu hier

Hallo,

habe einen Banner auf meiner Seite, der mir das Responsive Design "deaktiviert". Der liegt in einem DIV-Container und na ja, seitdem der da ist ist die Seite nicht mehr responsive. Wahrscheinlich weil der Banner einen width-Wert hat!?

Ich möchte jedenfalls, dass ab einer bestimmten Bildschirmauflösung der DIV-Container einfach nicht mehr angezeigt wird. Raubt eh zuviel Ladezeit bei mobilen Geräten so nen Banner :rolleyes:

Also schön wäre es nicht nur in auf invisible zu setzen mit CSS (denn dann läd er ja trotzdem) sondern ihn vielleicht gleich komplett zu "deaktivieren". Geht sowas? Nutze Wordpress.

Vielen Dank für Eure Tipps!
 

patrick_l

Hat es drauf

AW: DIV-Container soll ab bestimmter Bildschirmauflösung verschwinden

Setze dich mit der Verwendung von Media Queries auseinander. Über CSS(3) kannst du dann einfach mittels display:none; deinen Banner für bestimmte Auflösungen »ausblenden«.

Auch solltest du dich mehr mit dem Thema responsive Webdesign vertraut machen. Denn Breitenangaben (width) werden auch dort genutzt. Nur eben (meistens) keine fixen Werte (em, Prozent).

Liebe Grüße, Patrick

Liebe Grüße, Patrick
 

cebito

undefined

AW: DIV-Container soll ab bestimmter Bildschirmauflösung verschwinden

Setze dich mit der Verwendung von Media Queries auseinander. Über CSS(3) kannst du dann einfach mittels display:none; deinen Banner für bestimmte Auflösungen »ausblenden«.
Das ist hier nicht die Lösung, da sie ja trotzdem geladen werden. Der Traffic bleibt also derselbe ;)
 

cythux

Aktives Mitglied

AW: DIV-Container soll ab bestimmter Bildschirmauflösung verschwinden

Dies wäre eine möglichkeit, aber der traffic bleibt
Code:
z-index : -9999px;

oder

Code:
/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

Code:
display:none;
ist auch nicht so das wahre für SEO http://css-tricks.com/snippets/css/accessibilityseo-friendly-css-hiding/
 

Curanai

Aktives Mitglied

AW: DIV-Container soll ab bestimmter Bildschirmauflösung verschwinden

Guten Morgen,

überdenke die Einbindung Deines (Werbe-?)Banners: asynchron Nachladen. Das spart beim Seitenaufbau direkt Bandbreite und lässt sich nur dann laden, wenn auch erforderlich (= Auflösung); in Anlehnung an den verwendeten Client.

Theoretisch könntest Du also tatsächlich auf Patricks "media-queries" zurückgreifen, die Dir dann bei entsprechender Geräteverwendung eine gezielte Klasse im Source hinterlegen (ähnlich einer Prüfung auf die Präsenz von Werbeblockern in JavaScript). Diese greift bspw. (da in Wordpress) jQuery ab (nach $(document).ready(); checkt auf Präsenz - falls da, kein Banner, da Mobilgerät - falls nicht da, Banner laden).

Irgendwer wird jetzt bestimmt sagen, dass man doch mit den angebotenen "Abstandsmessern" in JavaScript arbeiten könne ... joar, kann man (muss man kennen und mögen) - ich bin weiterhin der Meinung, dass Tool- und Sidebars für "andere Zahlen" sorgen könn(t)en. Hier wäre .width() in jQuery zu nennen (ein Beispiel findest Du direkt hinter dem Link).

"Dreckig" und auch nicht "100%ig cool" - keine Frage ... harmoniert aber und ist schnell realisiert.

Viel Erfolg.
 

Curanai

Aktives Mitglied

AW: DIV-Container soll ab bestimmter Bildschirmauflösung verschwinden

Nicht falsch verstehen - ich spreche (da media-queries) von einer CSS-Klasse!! ;) Oder überschätze ich die Dinger gerade ...?!

EDIT: Jupp ... dann gilt dies zu streichen!

EDIT²: Najaaaa ... situiert auf
Code:
@media print {     body { font-size: 10pt }   }   @media screen {     body { font-size: 13px }
    .fundstueck { ... }
  }   @media screen, print {     body { line-height: 1.2 }   }
Theoretisch ließe sich dann auf .fundstueck via style-Selector zzgl. indexOf durchaus prüfen.
 
Zuletzt bearbeitet:
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.614
Beiträge
1.538.351
Mitglieder
67.525
Neuestes Mitglied
mgtaucher
Oben