Box di ricerca simile a firefox

**Massmino** · 05-03-2007, 04:07

Salve a tutti,
Vorrei sapere come realizzare un box di ricerca simile a firefox, ovvero con la possibilità di cambiare motore e visualizzare l'icona relativa. Ho scoperto che un sito molto famoso yahoo ha realizzato qualcosa del genere, la domanda è come posso farlo simile ? Premetto che non so molto di javascript se ci fosse qualche script pronto su cui lavorare sarebbe meglio grazie

Allego 1 immagine per chiarire meglio

**Andrea1979** · 05-03-2007, 10:04

non puoi semplicemente copiare dal sito in questione e sistemare secondo le tue esigenze?

**cavicchiandrea** · 05-03-2007, 10:11

Originariamente inviato da Massmino
Salve a tutti,
Vorrei sapere come realizzare un box di ricerca simile a firefox, ovvero con la possibilità di cambiare motore e visualizzare l'icona relativa. Ho scoperto che un sito molto famoso yahoo ha realizzato qualcosa del genere, la domanda è come posso farlo simile ? Premetto che non so molto di javascript se ci fosse qualche script pronto su cui lavorare sarebbe meglio grazie

Allego 1 immagine per chiarire meglio

Spero (x te) di sbagliami ma escludo che troverai qualcosa di gia pronto, e realizzare uno script simile (soprattuto nella grafica) non è uno stupidagine per chi js non lo conosce bene.

**pierofix** · 05-03-2007, 11:00

Prova a dare un'occhiata all'esperimento fatto dal buon gizax e dal buon andrea.paiola:

- http://www.gizax.it/articles/2005/ahah/

**Andrea1979** · 05-03-2007, 12:05

Solo una traccia

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento senza titolo</title>
<script language="javascript" type="text/javascript">
//icon; action; searchfield name;
var formParameters = [
  ["images/google.gif", "http://www.google.it/search", "q"],
  ["images/yahoo.gif", "http://search.yahoo.com/search", "p"],
  ["images/wikipedia.gif", "http://....", "r"]
];
function showMenu(ids) {
  document.getElementById(ids).style.display = "block";
}

function updateform(dstimg,elem) {
  document.getElementById(elem).getElementsByTagName('img')[0].src = formParameters[dstimg][0];
  document.getElementById('menu').style.display = "none";
  document.getElementById(elem).getElementsByTagName('input')[0].value = "";
  document.getElementById(elem).getElementsByTagName('input')[0].focus();
  document.multisearch.action = formParameters[dstimg][1];
  document.getElementById('searchfield').name = formParameters[dstimg][2];
}
</script>
</head>

<body>
<form name="multisearch" action="http://www.google.it/search" method="get">
<div id="textsearch">
  <span style="height:18px;border:1px solid #0099FF;">
  [img]images/google.gif[/img]
  <input id="searchfield" type="text" style="border:0px solid #FFF;height:18px;" name="q" value="Cerca..." />
  </span><input type="submit" value="Cerca..." />
</div>
  <div id="menu" style="position:absolute;display:none;border:1px solid #CCC;">
    <span class="highlight">[img]images/google.gif[/img] Google</span>

	<span class="highlight">[img]images/yahoo.gif[/img]Yahoo!</span>

	<span class="highlight">[img]images/wikipedia.gif[/img]Wikipedia</span>
  </div>
</form>
</body>
</html>

nella cartella "images" ci metti le iconcine dei motori di ricerca (i nomi dei file devono corrispondere nell'array formParameters).

**Massmino** · 06-03-2007, 02:45

Grazie funziona benissimo!

Discussione: Box di ricerca simile a firefox

Strumenti discussione

Ricerca discussione

Visualizza

Box di ricerca simile a firefox

Re: Box di ricerca simile a firefox

Permessi di invio