Datenschutz Impressum

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann

Die Foren sind geschlossen. Für Fragen zu MR, NOF & mehr steht Tommys Forum zur Verfügung. Ich danke für die langjährige Treue und Mitarbeit! Eure Administratorin.

Galerie-Vorschaubildchen formatieren?
#1
ich habe schon wieder was vergessen.
Wie kann ich die Vorschaubildern der Galerie etwas umformatieren?

Frank
Alle Beiträge dieses Benutzers finden
#2
Moin,

was willst Du denn anpassen?

Diese Galerien sind ja eine Variante der früheren "Visual Lightbox" und werden als "Plugin" im "Code Editor" ja nur eingelesen. Man kann schon einiges an der CSS im "CSS Editor" anpassen oder Du musst mal in die dazugehörigen Dateien gucken:

/assets/gallery/script.js

/assets/gallery/style.css

Ich selbst habe doch nie etwas geändert, gerade aber mal ein wenig im Bereich "CSS Editor" vom "Code Editor" probiert.

Ich habe im "CSS Editor" die Farbe von der Beschriftung und dem Overlay geändert, dem Overlay oben runde Ecken gegeben, die Beschriftung zentriert und den Thumbnails auch noch oben runde Ecken und eine Border gegeben.

http://www.mobirise-tutorials.com/Testse...ml#Galerie

Code:
img {
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  border: 2px solid;
}


.jpg  Galerie-CSS.JPG (Größe: 121,61 KB / Downloads: 78)
Alle Beiträge dieses Benutzers finden
#3
Ja, genau sowas.
Was mich gerade sehr wundert, an genau der gleichen Stelle hatte ich es heute Nacht auch versucht.
Ohne jedes Ergebnis.

Tja, vielen Dank jedenfalls. thumbs up
Alle Beiträge dieses Benutzers finden
#4
... da gibt es natürlich auch noch jede Mednge andere CSS-Klassen in der CSS-Datei, die zur Galerie gehört. Da habe ich jetzt noch nicht geguckt.

Hier noch meine gesamte CSS aus dem Bereich "CSS Editor":

Code:
padding-top: (@paddingTop * 15px);
padding-bottom: (@paddingBottom * 15px);
background-color: @bgColor;
.mbr-slider .carousel-control {
  background: #1b1b1b;
}
.mbr-slider .carousel-control-prev {
  left: 0;
  margin-left: 2.5rem;
}
.mbr-slider .carousel-control-next {
  right: 0;
  margin-right: 2.5rem;
}
.mbr-slider .modal-body .close {
  background: #1b1b1b;
}
.mbr-gallery-item > div::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: @overlayColor;
  opacity: 0;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  -webkit-transition: 0.2s opacity ease-in-out;
  transition: 0.2s opacity ease-in-out;
  & when (@gradOverlay) {
    background: linear-gradient(to left, @overlayColor, @overlayColor2) !important;
  }
}
.mbr-gallery-item > div:hover {
  .mbr-gallery-title::before {
    background: transparent !important;
  }
  &:before {
    opacity: @overlayOpacity !important;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
  }
}
.mbr-gallery-title {
  font-size: .9em;
  position: absolute;
  display: block;
  width: 100%;
  bottom: 0;
  padding: 1rem;
  color: yellow;
  text-align: center;
  z-index: 2;
  &:before {
    content: " ";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    position: absolute;
    background: @overlayColor !important;
    opacity: @overlayOpacity;
    -webkit-transition: 0.2s background ease-in-out;
    transition: 0.2s background ease-in-out;
    & when (@gradOverlay) {
      background: linear-gradient(to left, @overlayColor, @overlayColor2) !important;
    }
  }
}
img {
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  border: 2px solid;
}

... beachte auch die Class:

.mbr-gallery-item
Alle Beiträge dieses Benutzers finden
#5
Hm...wenn ich einen grauen Hintergrund habe und einen Radius angebe, bekomme ich weiße Ecken.
Da frage ich mich doch gerade, wo der herkommt.
Ich habe jeden Hintergrund, den zumindest ich finden konnte, schwarz gemacht.

Hm.... Undecided
Alle Beiträge dieses Benutzers finden
#6
jepp - da knabbere ich auch noch dran - deswegen ist mein Hintergrund auch weiß :D

Ich glaube das ist nicht weiß, sondern transparent - habe heute aber keine Zeit mehr danach zu suchen.
Alle Beiträge dieses Benutzers finden
#7
@Frank,

habe das übrigens jetzt noch mit den runden Ecken auf einem anders farbigen (schwarzem) Hintergrund noch hin bekommen. Da musste noch eine Class aus der CSS-Datei der Galerie geändert werden.

Browser-Cache erneuern:

http://www.mobirise-tutorials.com/Testse...ml#Galerie

Zitat:.mbr-gallery-item > div {
  background: #000;
}

.mbr-gallery-item > div:hover {
  background-color: #000;
  .mbr-gallery-title::before {
    background: transparent !important;
  }
}


.jpg  Galerie_CSS_anders.JPG (Größe: 121,02 KB / Downloads: 52)
Alle Beiträge dieses Benutzers finden


Möglicherweise verwandte Themen…
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Problem mit einer Galerie funsport 18 2.279 09.12.2020, 22:01
Letzter Beitrag: tino79
  Hilfe bei Galerie welche am besten einsetzen funsport 2 921 03.07.2019, 07:06
Letzter Beitrag: Rancher
  Suche eine Galerie die ich so umformen kann wie meine andere Blöcke funsport 6 1.342 02.07.2019, 17:58
Letzter Beitrag: Martin73
  Neue Probleme mit der Galerie stobi_de 2 953 02.07.2019, 08:12
Letzter Beitrag: stobi_de
  Bilder Galerie am Liebsten per Link aufrufen aber auch Versteckt funsport 32 4.074 30.06.2019, 14:06
Letzter Beitrag: funsport
  Mobi-Galerie-Close Button und Navik stobi_de 2 993 22.05.2019, 09:11
Letzter Beitrag: stobi_de
  Fehler in der mobirise obboard-Galerie magfly78 3 1.214 28.03.2019, 10:12
Letzter Beitrag: magfly78
  Galerie-Close-Button ändern? stobi_de 2 1.042 15.01.2019, 20:38
Letzter Beitrag: stobi_de
  Zeilenorientierte Galerie ? stobi_de 0 757 30.12.2018, 16:05
Letzter Beitrag: stobi_de
  Z-Index der Mobi-Galerie ändern? stobi_de 10 1.664 19.12.2018, 07:58
Letzter Beitrag: Tommy Herrmann



Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
nach oben An den Anfang der Seite scrollen
NetObjects Fusion Infos, Downloads und Updates Diese Website wird durch Bot-Trap vor Spam geschützt!