Neuigkeiten:

moziloCMS verwendet Cookies. Wenn Sie auf unserer Seite weitersurfen, stimmen Sie der Cookie-Nutzung zu Datenschutzerklärung
moziloCMS Layouts
moziloCMS Plugins

Hauptmenü

Flexisidebar Plugin - Spalte ausblenden wenn leer

Begonnen von marusti, 25. September 2014, 09:36:32

« vorheriges - nächstes »

marusti

Hallo,

das Plugin funktioniert soweit sehr gut.  Nur würde ich gerne noch die Spalte komplett ausblenden wenn sie leer ist und den Rest verbreitern.

Bsp:
Inhalt: 800px breit, Spalte rechts: 200px - Wenn Spalte rechts leer ist, soll Inhalt 1000px sein

Ist das mit diesem Plugin möglich?

marusti

da ich es mit dem Plugin nicht hinbekommen habe, habe ich es mit JS gelöst.
Falls es jemanden interessiert, hier der Code

<script>
<!--
$('document').ready(function () {
    if ($('#rechts').html() == "") {
        $('#rechts').hide();
        $('#inhalt').css('width', '100%');
    };
});
-->
</script>

Jochen

Hochhol, marusti ich bin ein css nob. Könntest Du mir sagen wo dein Code hin muss? Bzw wie ich das machen muss. Ein anderer Member kann mir das natürlich auch gerne sagen.

Gruß Jochen

marusti

Hallo Jochen,
das gehört in die template.html Datei, am Besten ganz ans Ende vor </body>

Jochen

Marusti, danke für die Antwort. Kann der Script einfach in das Template.html kopiert werden? Ich habe das Kopiert, aber es ändert sich nix. Ich nutze das Layout von Thorsten (Grimme) und auf der Startseite die rechte Seite als Info Rand. Auf den weiteren Inhaltsseiten wird der Rand nicht benötigt und es sähe besser aus wenn die Flexbar nicht vorhanden ist.

marusti

Du müsstest #rechts und #inhalt an deine div namen anpassen.
Hast du einen Link zu deiner Seite wo man es sich anschauen kann?

Jochen

Marusti, siehste da ist der noob in mir. Ich komm natürlich nicht auf sowas. Darum bekomme ich das mit dem moziloGB auch nicht hin. aber das ist ein anderes Thema. Zu dem Link: http://jigangler.de. Ich hoffe ich werde nun nicht verurteilt ::)

marusti

Verurteilt wird hier keiner. Versuch es mal so:

<script>
<!--
$('document').ready(function () {
    if ($('#maincontent-right').html() == "") {
        $('#maincontent-right').hide();
        $('#maincontent-left').css('width', '100%');
    };
});
-->
</script>

Jochen

#8
Wenn ich das an die richtige Stelle kopiert habe klappt es leider nicht.

djr

@marusti & @Jochen:
Das Script wird so nicht funktionieren.
Es ist kein pures JS. Sondern scheint auf einem JS-Framework (wahrscheinlich jQuery) zu basieren.

@Jochen: Beachte, dass im Layout Deiner Site der rechte Inhaltsbereich bei zu schmalen Bildschirmen (kleiner 768px Breite) ausgeblendet wird. Siehe in der Datei mobile.css.

marusti

djr war schneller und hat Recht, es ist JQuery und das ist auf der Seite nicht eingebunden.

Jochen

Ja die mobile.css verstehe ich so oder so noch nicht. Ich dachte weil da mobile dran steht ist die für Smartphone. Aber wenn ich die Seite mit dem Smartphone aufrufe, sehe ich nur den Header. Wenn ich bei dem Smartphone Browser die Desktopversion anforder sehe ich erst die Seiten.

Edit: Also für mich nicht anzuwenden?

djr

@Jochen: Die mobile.css kommt bei kleineren Anzeigegrößen zur Geltung. Also auch am PC wenn das Anzeigefenster nur ein Teil des Bildschirms einnimmt.


djr

Zitat von: Jochen am 14. März 2017, 17:37:59Aber wenn ich die Seite mit dem Smartphone aufrufe, sehe ich nur den Header.

Dein HTML hat einen Fehler, der mehrere Darstellungsfehler verursacht.
Das <div id="topheadername"> wird nicht wieder geschlossen.
<div id="topheader">
    <div id="topheadername"><a href="/">Anglerdemo im Fehmarnsund</a>
               
</div>

Richtig ist:
<div id="topheader">
    <div id="topheadername"><a href="/">Anglerdemo im Fehmarnsund</a></div>
               
</div>

Durch den Fehler wird u.a. der Text im Inhaltsbereich zu groß dargestellt. (Dem hast Du wohl durch Textformatierung im Editor entgegengewirkt.)
Behebe den Fehler und auch die "mobile"-Ansicht wird wieder gehen.

Jochen

#14
@djr, ich möchte nix kaputt machen. Aber bei mir steht

<div id="topheader">
            <div id="topheadername"><a href="{BASE_URL}">Anglerdemo im Fehmarnsund</a>
               
         </div>

Bei a href steht bei mir noch Base_URL. Das kann ruhig weg? Natürlich muss noch das </div> am Ende der Zeile Fehmarnsund

Ok, ich habe es. Und du hast recht. Mobil klappt besser. Danke für die Hilfe