zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Suchleiste, Suchfeld bei default...

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 06.11.2008, 16:29
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.10.2008
Beiträge: 7
Shino befindet sich auf einem aufstrebenden Ast
Standard 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;
	}
Hier mein Suchfeld:
HTML-Code:
<div id="searchbar">
<input type="text" class="searchbar"  ID="suche" />
</div>
Danke im Voraus

Geändert von Shino (06.11.2008 um 16:32 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 06.11.2008, 17:32
Benutzerbild von Timo
table-layout: none;
XHTMLforum-Kenner
 
Registriert seit: 11.11.2006
Beiträge: 5.345
Timo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein Lichtblick
Standard

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
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 06.11.2008, 19:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.10.2008
Beiträge: 7
Shino befindet sich auf einem aufstrebenden Ast
Standard

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?
Mit Zitat antworten
  #4 (permalink)  
Alt 06.11.2008, 20:10
Benutzerbild von Timo
table-layout: none;
XHTMLforum-Kenner
 
Registriert seit: 11.11.2006
Beiträge: 5.345
Timo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein Lichtblick
Standard

Ich seh da keine hervorhebung. Aber das Runde haben die mit jeweils einem span Links bzw. Rechts vom Feld gemacht.
__________________
Um weitere Erklärungen eingeblendet zu bekommen, drücken Sie bitte die Tastenkombination Alt + F4
Mit Zitat antworten
  #5 (permalink)  
Alt 06.11.2008, 20:26
EvT EvT ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.09.2006
Ort: Bad Wildungen
Beiträge: 2.220
EvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekannt
Standard

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)
Mit Zitat antworten
  #6 (permalink)  
Alt 06.11.2008, 20:58
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.10.2008
Beiträge: 7
Shino befindet sich auf einem aufstrebenden Ast
Standard

Hammmmaaaaaaaa.. Danke für den Tipp
Mit Zitat antworten
  #7 (permalink)  
Alt 06.11.2008, 21:08
Benutzerbild von Timo
table-layout: none;
XHTMLforum-Kenner
 
Registriert seit: 11.11.2006
Beiträge: 5.345
Timo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein Lichtblick
Standard

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
Mit Zitat antworten
  #8 (permalink)  
Alt 06.11.2008, 21:16
EvT EvT ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.09.2006
Ort: Bad Wildungen
Beiträge: 2.220
EvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekannt
Standard

Danke Dir, Timo. Ich habe meinen kaputten Link durch einen Link auf Dein Posting korrigiert. Okay?
Mit Zitat antworten
  #9 (permalink)  
Alt 07.11.2008, 03:16
Benutzerbild von aboleo
OperaRueles!
XHTMLforum-Mitglied
 
Registriert seit: 23.04.2008
Ort: Erlangen
Beiträge: 139
aboleo befindet sich auf einem aufstrebenden Ast
Standard

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
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ä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


Alle Zeitangaben in WEZ +2. Es ist jetzt 19:43 Uhr.