buenos dias pues el problema que funciona a la perfeccion pero cuando el usuario termina de buscar esas busquedas se quedan hay no se cierra,lo que quiero es que se cierre cuando se de un click en otro lugar de la pantalla:
tengo esto:(seguramente algo falta en el script en el index.php):

a ver si alguien me indica lo que debo corregir:saludos graciass..
finder.php:
Código PHP:
Ver original<?php
include('db.class.php');
if($_POST)
{
$q=$_POST['query'];
$db=new DB();
$db->connectDB();
$db->executeQuery($q);
while($row=$db->fetchArray())
{
$nombre=$row['nombre'];
$ape=$row['apellido'];
$img=$row['imagenPerfil'];
$ciudad=$row['ciudad'];
$amigos=$row['amigosComun'];
$nombreResaltado='<b>'.$q.'</b>';
$apeResaltado='<b>'.$q.'</b>';
?>
<div class="display_box" align="left">
<img src="images/<?php echo $img; ?>" style="width:50px; float:left; margin-right:6px" /><?php echo $nombreFinal ; ?> <?php echo $apeFinal ; ?><br/>
<span style="font-size:11px; color:#999999"><?php echo $ciudad; ?></span><br/>
<span style="font-size:9px; color:#9999ff"><?php echo "Amigos en común:".$amigos; ?></span>
</div>
<?php
}
}
?>
index.php:
Código PHP:
Ver original<html>
<head>
<style>
.drop-shadow { margin:2em 40% 4em; }
*{margin:0px}
#searchbox
{
width:250px;
border:solid 1px #000;
padding:3px;
}
#display
{
width:250px;
display:none;
border-left:solid 1px #dedede;
border-right:solid 1px #dedede;
border-bottom:solid 1px #dedede;
overflow:hidden;
}
.display_box
{
padding:4px;
border-top:solid 1px #dedede;
font-size:12px;
height:50px;
}
.display_box:hover
{
background:#3b5998;
color:#FFFFFF;
}
</style>
<link rel
="stylesheet" href
="../live_examples.css" type
="text/css"></link
>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function(){
$(".search").keyup(function()
{
var box = $(this).val();
var dataString = 'query='+ box;
if(box!='')
{
$.ajax({
type: "POST",
url: "finder.php",
data: dataString,
cache: false,
success: function(contenido)
{
$("#display").html(contenido).show();
}
});
}return false;
});
});
</script>
<title>Suggest con Ajax, PHP y jQuery</title>
</head>
<body>
<div class="logo"></div>
<div class="drop-shadow curved curved-hz-1">
<h3>buscador</h3>
<input type="text" class="search" id="searchbox" />
<div id="display">
</div>
</div>
</body>
</html>
dbclass.php:
Código PHP:
Ver original<?php
class DB{
private $hostname = "xxxxxxx";
private $user = "xxxxx";
private $password = "xxxx";
private $database = "xxxxxx";
private $tableName="labs_user_info";
private $db;
private $resource;
public function connectDB() {
$this->db = mysql_connect( $this->hostname,$this->user,$this->password) or
die("Could not connect database"); }
public function executeQuery($q) {
$this->resource=mysql_query("select * from $this->tableName where nombre like '%$q%' or apellido like '%$q%' "); }
public function fetchArray() {
}
}
?>