|
|||
Suchleiste, Suchfeld bei default...
Hi alle zusammen,
hab wieder mal ein Suchfeld Problem: Wie mach ich´s wenn der User einen Suchbegriff eingibt, aber nicht die suche fortsetzt... Also im Suchfeld was eingibt und dann nicht auf Enter sondern daneben klickt... Möchte das in diesem Falle, das Suchfeld wieder in sein ursprünglichen Zustand zurückspringt (beim daneben klicken)... Dann würde ich gerne wissen (da ich einen Mac hab und das nicht auf IE 6 und höher testen kann), ob beim anklicken im Suchfeld ein blauer Rahmen zusehen ist? Vielleicht habt ihr Erfahrungen damit FF, Opra zeigen den Rahmen beim onFocus nicht an, Safari mit Rahmen und IE 5 auf dem Mac blendet das Textfeld weiss auf die HG-Bild!!!!! Kann man da was machen? Hier mein CSS-Code: Code:
.searchbar{ position:absolut; width:118px; height:10px; margin: 5px 15px auto auto; padding: 10px 10px 10px 30px; color:#CCCCCC; float:right; background-image:url(images/searchbar.jpg); background-repeat:no-repeat; border:none; } .searchbar:focus { position:absolut; width:118px; height:10px; margin: 5px 15px auto auto; padding: 10px 10px 10px 30px; color:#CCCCCC; float:right; background-image:url(images/searchbarOver.jpg); background-repeat:no-repeat; border:none; } HTML-Code:
<div id="searchbar"> <input type="text" class="searchbar" ID="suche" /> </div> Geändert von Shino (06.11.2008 um 16:32 Uhr) |
Sponsored Links |
|
||||
Bei :focus musst nur das reinschreiben was sich ändern soll. Aber zum verhalten in den anderen Browsern kann ich dir nicht sagen
Sicher ist, dass der IE und ein paar andere, kennen :focus nicht. Zu dem mit dem Text wieder löschen, musst du mit JS machen. Ungefähr so Code:
onblur="this.value = '';"
__________________
Um weitere Erklärungen eingeblendet zu bekommen, drücken Sie bitte die Tastenkombination Alt + F4 |
Sponsored Links |
|
|||
danke Timo, hat auf jeden Fall weiter geholfen...
Hast du vielleicht eine Ahnung wie die auf http://www.apple.com die Suchleiste gemacht haben? Diese schönen Abgerundeten Kanten und der Rahmen der beim aktivieren auch rund ist? JavaScript? Wie kann ich sowas auch realisieren? |
|
|||
Diese hübsche "OS X Style Searchbox" gibt es bereits fix und fertig: OS X style searchbox
Alle erforderlichen Dateien kannst du dir dort auch als Zip-Archiv herunterladen (Link am Ende des Artikels). Lies dir auch die Kommentare durch. Geändert von EvT (06.11.2008 um 21:14 Uhr) |
|
||||
Link nochmal verbessert, da hat sich ein <br /> eingeschlichen: OS X style searchbox : CSS . XHTML . Javascript . DOM : Brand Spanking New
__________________
Um weitere Erklärungen eingeblendet zu bekommen, drücken Sie bitte die Tastenkombination Alt + F4 |
|
||||
Um nicht gerade einen neuen Thread aufzumachen und da das Thema hier bereits angesprochen worden ist, haeng ich meine Frage hier gleich mal mit an.
Kann es sein, dass beim Opera sich der Text, bedingt durch die 3px padding am unteren Rand der Suchbox orientiert?! Bei dieser OS X serchbox ist es mir zwar schon vorher aufgefallen aber ich glaube, das hatte ich damals irgendwie geloesst bekommen, nur kann ich mich leider nicht mehr daran erinnern. Vllt. gibt mir mal jemand von euch so'n kleinen Schubbs.
__________________
Ad pedem litterae |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem beim hinzufügen von weiteren Punkten in DB | |SONY| | Serveradministration und serverseitige Scripte | 7 | 11.07.2010 17:11 |
Suchfeld Problem im IE | VincentSpamn | CSS | 7 | 06.10.2009 11:47 |
MySQL-#1067 - Invalid default value for 'time' | Knuddelsgrafiken | Serveradministration und serverseitige Scripte | 2 | 19.01.2008 22:10 |
Skiplink direkt in ein Suchfeld? | andir | Barrierefreiheit | 5 | 13.12.2007 19:53 |
#1064 Error - Konflikt zwischen zwei Datenbank versionen? | pRe | Serveradministration und serverseitige Scripte | 8 | 11.02.2007 13:41 |