Beantwoorden
Ex-Netweter
 

zoekfunctie op website zonder php

In html heb ik een zoekformulier gemaakt, maar nu moet de functie nog werken binnen de website. Weet iemand een script?

jquery.color.js
script.js


<form id="searchForm">
<fieldset>
<div class="input">
<input type="text" name="s" id="s" placeholder="zoek op deze website" />
</div>
<input type="submit" id="searchSubmit" value="" />
</fieldset>
</form>

#searchcontainer {
width:240px;
height:100%;
margin:0 auto;
position:relative;
}

#searchmain {
width:240px;
position:absolute;
top:50%;
margin:-10px 0 -120px 0;
}

/*-------------
SEARCH
-------------*/

#searchForm fieldset {
width:200px;
position:relative;
display:block;
border: 0px;
}

div.input {
width: 160px;
border-radius:10px;
border:1px solid #c6d2db;
border-top:1px solid #b4c1cb;
box-shadow:inset 0 1px 2px rgba(0,0,0,0.08);
float:right;
background-color: #e8edf1;
padding: 0px;
margin: 0 15px 0 15px;
background:#e8edf1;
border-bottom: 3px solid #767676;
border-left: 3px solid #767676;
box-shadow: 0 2px 4px #666666;

}

div.input.focus {
border:1px solid #9ecbe2;
box-shadow:0 0 6px #abdcff, inset 0 1px 2px rgba(0,0,0,0.08);
}

input#s {
width:220px;
border:0;
border-radius:20px;
background:transparent;
height:100%;
color:#b4bdc4;
text-shadow:0 1px 1px #fff;
}

input#s:focus {
outline:none;
width: 250px;
}

input#searchSubmit {
width:19px;
height:19px;
text-indent:-9999px;
overflow:hidden;
background:url(../images/search-icon.png) no-repeat;
border:0;
position:absolute;
top:7px; right:13px;
z-index:5;
display:none;
cursor:pointer;
}

 

 

0 Likes
Beantwoorden
2 reacties
VincentD
Ex-Moderator
Berichten: 193
Lees je nog iets anders? ;-) De vernieuwde WIGO? Lezersgoud. Respect! Even demarreren...

zoekfunctie op website zonder php

Is er iemand die @Ex-Netweter kan helpen met het maken van een script voor zijn website?

Vincent

"I've tried absolutely nothing and I'm all out of ideas."
Vergeet niet om likes te geven en/of als oplossing te markeren.

0 Likes
Beantwoorden
Arthur2
Experienced Meesterweter
Berichten: 3098
Krak 2017 Krak 2018 Ere-Krak Jij Netweters wikipedia!

zoekfunctie op website zonder php

Bekijk dit eens:

http://www.javascriptkit.com/howto/search2.shtml

 

En dit

http://www.textfixer.com/tutorials/html-search-box.php

 

Ik ben zelf maar een beginnen met javascriptJmaar ik ken wel wat mensen die je kunnen helpen 🙂

   Arthur2 | Ere-Krak
   Don’t comment bad code—rewrite it. – Brian Kernighan
   Vergeet niet om likes te geven en/of als oplossing te markeren.
0 Likes
Beantwoorden