HTML/CSS Bilder hintereinander legen + umblättern

Aagrus

Grünschnabel
Ich will eine richtige Webseite erstellen.
Bin schon ziemlich weit gekommen
Das schwierige ist, die Bilder richtig anordnen.

Also mein problem ist (gut lesen bitte):
  • Ich hab ca. zwischen 6 - 10 Bilder pro Ansicht (Außen/Innen) und die nebeneinander zu legen oder auf die Seite untereinander zu reihen ist nicht schön.
  • Ich möchte daher die Bilder nebeneinander legen und sie sollten sich ein wenig überlappen!
  • Man sollte aber das hintere Bild anklicken können und dann ist das erste Bild hinter dem zweiten!
Und immer so weiter bis zum letzten Bild!

Ich hab hier eine Seite gefunden, die so etwas gemacht hat!
Hier der link: http://store.steampowered.com/genre/Early Access/

Mitlerweile hab ich es schon Wochenlang probiert ohne erfolg :(

Hoffe ihr könnt mich bei diesem Projekt helfen :)

MFG.
 
Was meinst Du mit "ohne rotation"? Wenn Du die Bilder flach haben möchtest, kannst Du das durch den Parameter "rotate" steuern, indem Du diesen auf 0 setzt.
 
Genau
Und noch zwei Frage:
1. Wie kann ich meine Webseite vollkommen ohne Zoomfunktion einstellen
Ich hab schon die Webseite mit diesem code belegt aber das funktioniert nicht so richtig
HTML code:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

Weil wenn sie Zoomen, kommt das Hintergrundbild so oft vor... :/

Und
2. Ich hab die Webseite auch auf verschiedene Bildschirmgrößen angepasst.
Ich will aber, dass das Hintergrundbild nicht in die länge gestreckt wird ne mindestgröße einbauen
drum hab ich: min-width: 600px; eingestellt

Aber jetzt gibt es ein weiteres problem:
Das Hintergrundbild geht drotzdem noch kleiner...
Dann kommt es bei einer breite von 300px doppelt vor...

hier der CSS code:

body
{
background-image: url('background1.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;
font-size: 100%;
margin: 0em;
padding: 0em;
min-width: 600px;
}
 
Zuletzt bearbeitet:
Das meinte ich damit ;):)
Danke für die beantwortung der Hauptfrage

aber brauch ich hier auch Java Skript??
 
Aber jetzt gibt es ein weiteres problem:
Das Hintergrundbild geht drotzdem noch kleiner...
Dann kommt es bei einer breite von 300px doppelt vor...

hier der CSS code:

CSS:
body
{
background-image: url('background1.jpg');
background-size: 100% 100%;
background-repeat: no-repeat;
font-size: 100%;
margin: 0em;
padding: 0em;
min-width: 600px;
}
Das min-width wirkt hier auf body und nicht auf das Hintergrundbild.
 
Aber dadurch das ich es nur in CSS erwähnt habe, kann ich es ja nicht mehr ändern oder??
Oder zumindest eine eigene Codezeile erstellen

Naja
Zur Hauptfrage:
Geht das auch, das ich soetwas sebst schreiben (programmieren) kann??
Ohne das ich da Plugins brauche und eve. rechte verletze??
 
Wenn Du dir die erforderlichen Kenntnisse aneignest, kannst Du so etwas auch selbst programmieren. Ist jedoch nicht zu empfehlen, denn Du kannst Swiper ohne Bedenken verwenden. Dieser steht unter der MIT-Lizenz und kann frei verwendet werden, man muss nur den Copyright-Hinweis und die Lizenz-Angabe drin lassen:
https://de.wikipedia.org/wiki/MIT-Lizenz
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück