anklickbares/interaktives Bild?

Hallo,

auf dieser webseite: Karosserie- & Lackzentrum Zeesen – Ihr Partner für Karosseriebau und Autolackierung in Königs Wusterhausen (karosseriebauer-lackierer.de)

befindet sich ungefähr in der Mitte der Seite ein bild, welches man in anklickbare bereiche unterteilt kann. Wie geht sowas, bzw. wie nennt sich die Software um sowas zu erstellen für zum beispiel webseiten

1 Antwort

Vom Fragesteller als hilfreich ausgezeichnet

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

HTML, Webseite, Webdesign

27.12.2023, 20:20

Das kann als (interactive) Image Map bezeichnet werden. Das konkrete Beispiel wurde mit Image Map Pro gebaut.

Für eine Eigenimplementation könnte man CSS (mask) nutzen oder man baut das Bild mittels SVG und wendet im Anschluss CSS/JavaScript auf die einzelnen Komponenten an.

Hallo zusammen,

ich möchte mit HTML einen Kalender erstellen, der allerdings nicht statisch sein soll. Damit meine ich nicht unbedingt, dass jeder manuell auf der Webseite Daten eintragen kann, sondern dass man zwischen den Monaten navigieren kann. Zum Beispiel innerhalb einer Zeitspanne von August 2022 bis August 2025 oder so. Dabei soll der Kalender beim Aufrufen der Seite, wenn möglich, den aktuellen Monat zeigen und durch Klicken auf ein Symbol (oder eventuell Drücken der Links- / Rechtstaste auf der Tastatur) kann man auf den vorherigen oder nächsten Monat wechseln.

Ich möchte das - verständlicherweise - nicht durch das Erstellen von 37 verschiedenen HTML-Dokumenten erreichen, durch die man dann mit Hyperlinks zwischen diesen Seiten hin und herwechseln kann.

Das Problem ist, dass ich sowohl von JavaScript als auch von PHP absolut keine Ahnung habe und auf keinen Fall irgendwo im Internet einen fünfzig-Zeilen-Code (JavaScript, PHP oder sonst irgendeine Programmiersprache) kopieren will, den ich zu 99,9% selbst nicht verstehen würde.

Weiß einer, wie ich so etwas nur mit HTML und CSS (und eventuell, wenn es sein muss, auch mit Java) hinbekomme?

P. S. Bitte gebt mir keine Antworten vom Stil "lerne einfach JavaScript". Das ist keine hilfreiche Antwort, da ich es eben ohne JavaScript erreichen will!

...zur Frage

CSS führt zur Trennung von...?

Ich bin der Meinung: Inhalt und Gestaltung.

Struktur kann man nämlich mit CSS auch gestalten...

...zur Frage

Ist es möglich, die Photoshop-Funktionen durch eine Photopea-Website zu ersetzen? Ist es eine anständige Website? Kann sie genutzt werden?

...zur Frage

Wieviel kostet eine Webseite?

Hallo. Ich brauche eine Webseite für meinen Friseur Salon. Ich möchte zudem einen Webentwickler beauftragen dies zu tun also kein Baukasten etc. Wieviel kostet eine Erstellung ca? Dabei soll eine Team Seite, Leistungen Seite, Kontakt Seite und eine Preisseite sein. Klar kommen auch die Öffnungszeiten drauf, welche aber keine extra Seite haben sollen.

...zur Frage

Welche Webhostinganbieter bieten mir eine kostenfreie Testphase an?

Ich hatte all inklusive ausprobiert und war zufrieden, aber will noch andere ausprobieren.

...zur Frage

Wie versende ich eine selbst programmierte Website per Email?

Ich habe eine Website für ein Thema in der Schule programmiert. Jetzt möchte ich gerne diese Website (eigentlich die Datei) über Email an meinen Lehrer versenden. Leider gibt es jedes mal ein Problem dabei, unzwar wird die geschickte Website nicht so angezeigt, wie sie sollte. Es sieht bisschen so aus, als wäre der ganze CSS Code dadurch gelöscht wurden (man sieht nichts außer normaler Schrift, keine Bilder usw.). Ich habe auch schon probiert sie als Zip-Datei zu schicken, doch auch das hat nichts gebracht. Gibt es dafür eine Lösung? Ich könnte mir auch vorstellen, dass das Versenden über Email der Fehler ist, allerdings weiß ich leider nicht weiter.

Vielen Dank an jeden, der vielleicht eine Lösung hat :)

...zur Frage

Wie kann man Text über JavaScript versenden?

Hi Leute, ich möchte eine kleine Homepage (HTML, CSS, JavaScript)erstellen und hätte gern eine Funktion, bei der man Text eingeben kann, der mir anschließend zugesendet wird. Bitte schreibt nicht, dass ich einfach eine E-Mail Adresse verlinken soll. Vielen Dank im Voraus. :-)

...zur Frage

Css div Container weissen Rand los werden?

Hey Leute, Lerne derzeit CSS und bin gerade bei einem Hindernis gelandet. Irgendwie ist ein weisser Rand aussen von meinem div Container entstanden und egal mit welchen Befehl, er geht einfach nicht weg. Habe es auch schon mit margin: 0%; versucht.

Nix hat funktioniert.

Ich würde den Code gerne einfügen jedoch ist er zu lang. Wenn jemand Interesse hat mir im privat Chat zu helfen kann ich gerne den Code zuschicken.

Hat jemand anderes trotzdem eine Ahnung was das sein kann und wie ich es loswerden kann? Habe den Code bereits kontrolliert und und nix finden können.

...zur Frage

Favicon wird mit Wix erstellter Website in den Google Suchergebnissen nicht angezeigt?

Servus,

meine Website ofen-hornberger.de die ich mit Wix erstellt habe, zeigt in der organischen Suche in Google kein Favicon an. In den Browsertabs funktioniert alles tadellos.

meine Frage ist nun ob ich hier selbst aktiv werden muss?

laut Google Richtlinie sollte man so vorgehen:

Implementierung

So sorgst du dafür, dass für deine Website in den Google-Suchergebnissen ein Favicon angezeigt werden kann:

Erstelle ein Favicon, das den unten aufgeführten Richtlinien entspricht.

2.Füge der Kopfzeile deiner Startseite einen link tag mit der folgenden Syntax hinzu

<link rel="icon" href="/path/to/favicon.ico">

muss ich das selbst machen oder macht Wix das automatisch?

Von seiten des Wix Supports kamen leider wiedersprüchliche Aussagen.

In der Google search Console ist ersichtlich, dass bereits nach einem Favicon gecrawled wurde jdeoch mit dem Ergebis "(404) nicht gefunden"

Daher denke ich, dass es mit abwarten nicht getan ist.

Hat jemand evtl ein tiefer gehendes Wissen zu dieser Thematik und kann mir hier weiterhelfen, ich wäre echt dankbar.

...zur Frage

App aus HTML Code?

Hallo,

ich habe einen HTML-Code und möchte diesen Code zu einer IOS App machen. Diese App soll dann auf Schulgeräten installiert werden. Wie kann ich das machen?

...zur Frage

HTML und CSS lernen?

Wie lang braucht man, um HTML und CSS zu lernen und macht es Sinn das anzufangen, obwohl man gerade erst Grundkenntnisse in Java hat?

...zur Frage

Elementor Footer nicht bearbeitbar?

Hallo!

Ich bin gerade dabei eine Wordpress Seite zu erstellen und habe eine Template von Elementor benutzt. Ich wollte die Informationen unten ändern, aber ich kann nicht die Sachen editieren.

Ich kann da nur raufklicken, aber nix passiert, im Navigator wird auch nix angezeigt? Kann mir da jemand weiterhelfen?

...zur Frage

CSS: Wie kann ich Karten gleich groß anzeigen?

Guten Tag,

ich habe einen kleinen Design-Bug in meiner Webseite.

(s. Bild)

Wie kann ich dieses Problem lösen?

Mein CSS:

<style>
.item {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  width: 10%;
  border-radius: 5px;
  background: #191c29;
  color: rgb(88 199 250 / 100%);
}
.con {
  background: #adadad;
  overflow: auto;
  overflow-x: hidden;
  background: #212534;
}

.item:hover {
  box-shadow: 0 16px 32px 0 rgba(250,250,250,0.2);
}
img {
  border-radius: 5px 5px 0 0;
  height: 150px;
	width: 100%;
}
.container {
  padding: 2px 16px;
}
body {
  overflow: hidden; 
}


* {box-sizing: border-box;}


body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
}




* {
  box-sizing: border-box;
}
body {
  font-family: Arial, Helvetica, sans-serif;
}
#flex-container {
   display: -webkit-flex;
   display: -ms-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
}
.item {
  float: left;
 /* width: 25%; */
  width: 15%; /* 10%*/
  height: 50%; /* 50% */
  padding: 20 10px;
  margin-bottom: 20px;
  margin-left: 20px;
  margin-right: 20px;
}
.row {
  margin: 0 -5px;
}
.row:after {
  content: "";
  display: table;
  clear: both;
}
.col-sm {
  text-align: center;
}
/* @media screen and (max-width: 600px) { */
@media screen and (max-width: 800px) {
  .item {
    width: 100%;
    display: block;
    margin-bottom: 20px;
  }
}
.text-center {
  text-align: center;
}
</style>

Der Code von einer Karte:

<div class="row">
<div class="item text-center">
  <div class="col-sm">
    <img src="textures/spawner.png" alt="textures/spawner.png" style="width: auto;">
    <div class="container">
      <h4><b>Spawner (*1)</b></h4>
      <p>Preis: 10 Mio Coins</p><p></p>
    </div>
  </div>
</div>&nbsp;
<div class="item text-center">
  <div class="col-sm">
    <img src="textures/spawner.png" alt="textures/spawner.png" style="width: auto;">
    <div class="container">
      <h4><b>Spawner (*1)</b></h4>
      <p>Preis: 10 Mio Coins</p><p></p>
    </div>
  </div>
</div>&nbsp;
</div>

Danke für jede Hilfe. Ich weiß, dass der CSS-Code nicht der schönste ist, allerdings lerne ich die Sprache noch!

...zur Frage

Termine buchen in Elementor?

Hallo,

ich möchte gerne über meine Seite ein Termin Buchungsformular laufen haben, das aussieht wie auf dem Bild. Mit Plugins hatte ich bis jetzt noch nicht die Möglichkeiten, die ich gerne hätte.

Der Funnel sollte einfach nur aus dem Kalender für den Wunschtermin und einem zweiten Schritt für die Datenübermittlung (Name, Email, Telefonnummer) bestehen. Hat da jemand einen hilfreichen Tipp? Oder könnte ich das sogar selbst bauen mit Elementor?

Danke!!!!

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen