Bin leider noch ein wenig unerfahren und noch nicht fündig geworden bei meiner bisherigen Internetrecherche - und im html Forum haben Sie mich mehr oder weniger hierher verwiesen.
Ich habe eine Liste mit verschiedenen Bennenungen, von denen ich gerne das Poweshift erklären lassen möchte. Siehe Grafik:
Ich habe diese Tabelle mit ein paar Grafiken als .jpg abgespeichert und auf der Internetseit platziert. Um das Wort Powershift anklicken zu können, habe ich mit folgendem Code dieses Produkt markiert und wenn man drüber geht, kann man es anklicken:
[HTML]
[/HTML]Nun ist es so, dass wenn ich darauf klicke, ich jegliche Internetadresse öffnen kann. Ich möchte aber, dass sich ein kleines Fenster öffnet (muss kein Browserfenster sein) mit einer Beschreibung wie: Powershift bedeutet bla bla bla. Ich habe gehört, dass dies mit der onclick Funktion geht und habe auch schon einiges probiert - geht aber irgendwie nicht.
In kurzen Worten= Wie bekomme ich es hin, damit ich auf dieses Feld klicke und sich ein kleines Fenster per Pop-up öffnet mit einer Beschreibung (+ dieses Fenster ich eventuell von der Höhe und Breite bearbeiten kann)?
Sorry, falls ich das ein wenig umständlich erklärt habe!
1000 Dank für jegliche Hilfe…
Element mit dem text zu erstellen und dieses über css zu verstecken (visibility: hidden). Bei einem „onclick“ wird die Box dann angezeigt (visibility: visible). Nun kann man noch einen link da rein machen der zum beispiel schliessen heisst. Dann sollte der oben genannte p tag in einem div stehen und sich der ganze code auf das Div beziehen
Also um das mal zu verdeutlichen
window.onload = function)( {
// Um Die Box sichtbar zu machen
document.getElementById("powerShiftShow").onclick = function() {
// Box sichtbar machen
document.getElementById("powerShiftBox").className = "visiblePowerShift";
};
// Um die Box zu schliessen
document.getElementById("closePowerShiftBox").onclick = function() {
// Box unsichtbar machen
document.getElementById("powerShiftBox").className = "hiddenPowerShift";
};
};
Das ganze dann noch mit CSS ausschmücken und tada :D.
Würde dir aber eventuell zu einer ähnlichen Variante raten, bloß dass es dann mit mouseover geht. Dann wird nämlich kein Javascript gebraucht.
Wie kommt man auf so eine Idee?
Wenn ich Text habe, gebe ich diesen als Text aus (hier richtig als Tabelle ausgezeichnet) und dann ist Deine Anforderung auch leichter umzusetzen.
Was machst denn Du, wenn der Nutzer keine Grafiken anzeigen kann/will/darf? Dann sieht er nichts und kann nichts machen. Ziel verfehlt - oder?
Hey Gilles - vielen Dank. Werde das gleich mal ausprobieren. Die Variante ohne Javaskript würde mir mehr gefallen - auch wenn es dann ein Mousover sein sollte.
Muss ich da viel ändern?
Du hast auf jeden Fall recht … aber die tabelle ist in wirklichkeit größer, mit grafiken und wenn ich das alles in html mache, dauert das schon viel zeit. zumindest für mich. Und das schlimme ist, es sind nur zwei Worte eigentlich.
Aber klar, wenn man die Bilder nicht sehen kann, hat es wohl auch das Ziel verfehlt… aber ich bin schon zu weit
Schau dir mal das Tutorial an für die CSS variante: Infobox mit CSS
Ansonsten zu deinem Bild. Ich denke: „ich bin schon zu weit“ Sollte nicht deine Ausrede sein. Du kannst ja vorerst die Bild Version online lassen, jedoch an einer tabellarischen Form arbeiten und diese hochladen sobald sie fertig ist.
Denn wenn das Bild echt so groß ist wie du sagst, brauchst dieses eine gewisse Ladezeit. Der text wird wesentlich schneller geladen. Wenn du dich mit HTML richtig auseinander setzt (Danach noch etwas mit css), solltest du die Tabelle recht zügig fertig gestellt haben. Wenn du dabei dann Probleme haben solltets, kannst du dir Hilfe im HTML im bzw. CSS Bereich hier im Forum holen. Denn es führt wohl kein Weg dran vorbei, wenn alle deine Tabelle anschauen können sollen.
„mouseover“, genaugenommen „onmouseover“ IST JavaScript (ein Event-Handler).
Wenn ich zum Autofahren erst einen Führerschein machen muss, dauert das für mich zu lang, da fahr ich lieber mit nem BobbyCar auf der Straße!!??!???!?
Aber klar, wenn man die Bilder nicht sehen kann, hat es wohl auch das Ziel verfehlt… aber ich bin schon zu weit
Das wiederum heißt soviel wie „Hab keinen Bock auf Euch Leute, die keine Grafiken sehen können oder die Ihr blind seid“.
Meine neckischen (aber berechtigten!) Kommentare natürlich immer unter der Voraussetzung, dass es sich um eine stinknormale, öffentliche Website handelt, und nicht um eine private Web-Anwendung. Wenn es dann noch eine gewerbliche Website werden soll, mit der Geld verdient werden muss, dann gibts noch den Fehdehandschuh feste ins Gesicht geklatscht für so viel Nutzerunfreundlichkeit.
Er meint natürlich ein CSS-Hover, was meines erachtens einem mouseover in Javascript gleich käme (bitte korrigieren wenns nicht stimmt :))
Hab das Wort mouseover nämlich im vorigen Beitrag benutzt.
Edit: Oder gilt hover auch für die Tastatur?
Die CSS-Variante ist auf jeden Fall nutzerfreundlicher. Kenn mich leider nicht mit den Textbasierten Browsern aus, aber können die leute mit dem browser auch einen Hover-Effekt auslösen?
Mir gefallen deine Kommentare. Und Gille seine natürlich auch.
Ihr seid ja alle auch Profis und macht das im handumdrehen. Ich beschäftige mich eben schon seit 2 Tagen (ihr werdet wohl darüber schmunzeln) mit dieser Kleinigkeit und im Grunde sollte ich mich von Anfang mit dieser Materie beschäftigen, und nicht nur irgendwelche html-Tags aus dem Internet kopieren und zuammenkleistern (-> so viel zum Thema Führerschein ;)).
Aber man macht das ja so selten und wenn man was gelernt hat, hat man es in wenigen Wochen, Monate schon wieder vergessen.
Muss noch etwas korrigieren: Ich habe das am Anfang falsch ausgedrückt mit der Internetseite. Ich mache eine Online-Befragung für meine Diplomarbeit. Dieses Programm kann man mit html-Tags bearbeiten. Ich komme bei meiner Befragung dann auf diese Produktliste, um den Leuten zu erklären, was auf Sie zukommt in der weiteren Befragung - und deshalb wollte ich gerne diese Infobox.
Also Efchen, du hast vollkommen recht - wenn es nicht alles sehen können, macht dies gar keinen Sinn! Wiederrum scheint es etwas komplizierter als Gedacht - werde mal versuchen, Gille seinen Vorschlag gründlicher anzuschauen - oder meint ihr, bei einer Befragung geht das gar nicht?
Also das Thema spielt ja an sich keine Rolle. Wenn du einmal weisst wie es mit der Semantik in HTML aussieht wirst du diese auch garantiert nicht mehr vergessen Und was CSS betriffst, so musst du dich auch nur mit den Sachen beschäftigen, die du in deinem Fall auch brauchst. Wenn du also logisches Denkvermögen hast, sollte deine Tabelle recht zügig in HTML umgesetzt sein. (Je nach Menge und deinem Lernverhalten ungefähr in 1-2 Stunden). Um dann die Popup-Box zu erstellen solltest du dir das Tutorial durchlesen. Wie lange das nun im Endeffekt dauert weiß ich auch nicht, da ich es selber nur grob überflogen habe
Falls du dort dann auf Probleme stoßen solltest, wirst du hier im Forum Hilfe kriegen.(Sind ja alle immer recht schnell hie rmit antworten :D)
Und nochwas…niemand schmunzelt über Anfänger. Jeder hat mal klein angefangen.
Aber wir reden einfach Tacheles und sehen keinen Sinn darin, ungünstige oder sinnfreie Lösungsansätze weiter zu verfolgen.
Aber in 2 Tagen ist eben noch kein Meister vom Himmel gefallen
