dudas con la propiedad .width(); de jquery

[20113784]

tengo un problema. quiero desaparecer un elemento cuando el ancho de pantalla 700px hacia abajo y que se desaparezca también cuando sea mayor a 800px.

pero no me funciona el codigo:
(gracias de ante mano)

<script type="text/javascript">
$(function() {
var resea = $('#resea');
buscador = $('input.min-buscador');
buscadorHeight = buscador.height();

$(resea).on('click', function(e) {
e.preventDefault();
buscador.fadeToggle();
});
});

$(window).resize(function(){
var z = $(window).width();
if(z < 700, z > 800 && buscador.is(':hidden')) {
buscador.removeAttr('style');
}
});
</script>

[moginn]

¿por qué no usas media queries para hacer desparecer elementos ?

[20113784]

Porque ya estoy usando media queries para ocultar el elemento... el elemento esta oculto desde un principio.

[Alexis88]

Como bien te aconseja moginn, estas cosas son mejor hacerlas con CSS pues no funcionará con aquellos usuarios que desactiven JavaScript de su navegador. Por otra parte, la condición está mal escrita, pues esto:

Código Javascript:

if(z < 700, z > 800 && buscador.is(':hidden')) {
 

Debería de ser así:

Código Javascript:

if ((z < 700 || z > 800) && buscador.is(':hidden')) {
 

Fíjate que uso el operador lógico OR para tomar uno de ambos casos y encapsulo esa respuesta para luego compararla con la tercera parte de la condición.

Saludos

[20113784]

Me gusto tu respuesta, gracias. Pero me gustaria que me aclares algo. Antes de que contestaras me puse a investigar y logre esto... el problema es que el o los elementos no se ocultan exactamente a la anchura que les indico. el de 700 se oculta aproximadamente a 717 y asi. Por que pasa esto?

Gracias de ante mano :)

$(function() {
var resea = $('#resea');
buscador = $('input.min-buscador');
buscadorHeight = buscador.height();

$(resea).on('click', function(e) {
e.preventDefault();
buscador.fadeToggle();
});
});

$(window).resize(function(){
var resolutionh=$(window).height();
var resolutionw=$(window).width();
if(resolutionw<=700)
{
jQuery(".min-buscador, .conten_mi-cuenta").hide();
}
if(resolutionw>750)
{
jQuery(".min-buscador").hide();
}
});

[Alexis88]

Lee lo que dice la documentación oficial. Puede ser que se trate —como en el primer ejemplo que muestran— de un tema de márgenes, relleno y borde.

Saludos