jQuery y ocultación: después de /: antes de pseudo clases

Duplicar posibles:
jQuery and pseudo-classes jQuery y ocultación: después de /: antes de pseudo clases

he intentado ocultar el: después de pseudo clase a través de jQuery en un número de maneras, pero sin éxito , He encontrado otra solución al agregar un tipo de div vacío debajo de mi div que contiene el contenido: after y luego ocultar el div por completo para que tenga el mismo efecto.

Sin embargo, estaba curioso si alguien había logrado encontrar una manera de ocultar el: después o antes de cosas. Esto es lo que intenté que no funcionó.

$('.search_box:after').hide(); 
$('.search_box:after').css('display', 'none');

Sólo para dar el contexto, tengo un div que contiene el formulario de búsqueda etc, y cuando la búsqueda se activa Quiero habilitar una pequeña flecha indicadora bajo el señalador div como a la lista de elementos encontrados (construido con: después de través de CSS) y cuando no se encuentra nada, o por defecto está en la lista de salida completa (ya que no se encontró nada), entonces quiero ocultarlo.

Fuente

2012-07-06 Andrew Lank

ve aquí: http://stackoverflow.com/questions/8968992/jquery-and-pseudo-classes – dcpomero

Al final acabo de utilizar un div justo debajo de mi cuadro de búsqueda, con una altura de 0 y el mismo ancho que el cuadro de búsqueda, y tiene el estilo posterior y lo escondo/lo muestra en lugar del cuadro de búsqueda, pero la solución de TJ VanToll a continuación también funciona bien. –

No puede hacer esto. Su mejor opción es usar una clase en el elemento para alternar la visualización del pseudo elemento.

<style> 
    .search_box:after { 
     content: 'foo'; 
    } 
    .search_box.hidden:after { 
     display: none; 
    } 
</style> 
<script> 
    //Instead of these 2 lines 
    //$('.search_box:after').hide(); 
    //$('.search_box:after').css('display', 'none'); 

    //Use 
    $('.search_box').addClass('hidden'); 
</script>

ejemplo vivo-http://jsfiddle.net/4nbnh/

Fuente

2012-07-06 00:32:30

esta es la mejor opción, ya que con otros métodos puede cambiar el contenido y el color, pero no puede cambiar la visibilidad. – Maverick

Gracias por responder, esta es la mejor solución que encontré en Internet ... –

Puede agregar dinámicamente un bloque <style> para anularlo. Déle un id y puede eliminarlo cuando sea necesario.

Demostración: http://jsfiddle.net/ThinkingStiff/TRLY2/

Guión:

$('#hello').click(function() { 

    if($('#pseudo').length) { 
     $('#pseudo').remove(); 
    } else { 
     var css = '<style id="pseudo">#hello::after{display: none !important;}</style>'; 
     document.head.insertAdjacentHTML('beforeEnd', css); 
    }; 

});

HTML:

<div id="hello">hello</div>

CSS:

#hello::after { 
    content: "goodbye";   
}

Fuente

2012-07-06 00:24:25 ThinkingStiff

ThinkingStiff tiene una idea bastante buena.

También puede agregar y eliminar una clase para su cuadro de búsqueda, y solo usar la etiqueta posterior con eso.

Algo así como .hide:after { display:none } y .show:after { /* normal css */ }. Luego simplemente intercambie estas clases con javascript.

corregir: mezcló los nombres

Fuente

2012-07-06 00:29:00 dcpomero

jQuery y ocultación: después de /: antes de pseudo clases

Respuesta

Cuestiones relacionadas