problema con script sencillo

[miwelillo]

Hola, llevo un rato dandole vueltas a este script pero no encuentro el fallo, a ver si alguien me ofrece otro punto de vista por que no hay manera!

Tengo una capa #middle en una pagina que quiero mostrar solamente cuando estoy en el index, aqui esta el codigo HTML:

Código PHP:

  <div id="search_form">
    <div id="search_form_content">
        <p>search products: <input type="text"><input type="button" value="search!"></p><span class="title">How it works?</span><span class="close">X</span>
    </div>
</div>
 
<div id="middle">
    <div id="content_middle">
        <span class="banner"><img src="img/banner_middle.jpg" width="700px" /></span>
    </div>
</div> 
   

El CSS:

Código PHP:

  #middle{
    background-color: #f0f0f0;
 
}
#search_form_content > .title{
    color: #eb8964;
    font-size: 44px;
    font-stretch: expanded;
    text-shadow: 3px 3px 4px #bbb;
    cursor: pointer;
}
#search_form_content > .close{
    color: #eb8964;
    font-size: 14px;
    font-stretch: expanded;
    text-shadow: 3px 3px 4px #bbb;
    float: right;
    cursor: pointer;
} 
   

y el JS:

Código PHP:

  <script type="text/javascript">
        (function(){
        //    Si no encontramos en el home, escondemos la capa
            var pageName = window.location.pathname;
            var pageName_arr = pageName.split('/');
            var count = pageName_arr.length;
            pageName = pageName_arr[count-1];
            console.log(pageName);
            if(pageName != "index.html" || pageName != "index.php"){
                $('#middle').hide();
            }
            else{
                $('#middle').show();
            }
 
            console.log($('#middle'));
 
            $('.close').on('click', function(){
                $('#middle').slideUp();
            });
 
            $('.title').on('click', function(){
                $('#middle').slideDown();
            });
        })();
    </script> 
  

Las funciones de mostrar y ocultar funcionan a la perfeccion pero por algun motivo la capa me aparece siempre oculta. Si miro la variable pageName me muestra que efectivamente me encuentro en index.html pero no me muestra la capa y si miro el objeto $('#middle') me muestra que tiene la propiedad visibility: hidden aun cuando yo no se la he definido !!

Alguien me sabria decir donde me estoy equivocando?

Muchas gracias!

[Naahuel]

Tu error es claramente este:

Código Javascript:

if(pageName != "index.html" || pageName != "index.php"){
 

Pensá la lógica. Si la página no es index.html O no es index.php entonces esconder la capa.

Si estás en el index.html, este NO ES index.php por lo que cumple la segunda condición y oculta la capa.

Dejalo así nada más si no vas a trabajar con un .php:

Código Javascript:

if(pageName != "index.html"){
 

[miwelillo]

Iniciado por Naahuel

Tu error es claramente este:

Código Javascript:

if(pageName != "index.html" || pageName != "index.php"){
 

Pensá la lógica. Si la página no es index.html O no es index.php entonces esconder la capa.

Si estás en el index.html, este NO ES index.php por lo que cumple la segunda condición y oculta la capa.

Dejalo así nada más si no vas a trabajar con un .php:

Código Javascript:

if(pageName != "index.html"){
 

Efectivamente, gracias por señalar el error. Me he dado cuenta justo despues de postear el hilo

Ya lo he arreglado y me funciona correctamente!

Al final lo he que he hecho ha sido invertir la sentencia:

Código PHP:

  if(pageName == "index.html" || pageName == "index.php"){
$('#middle').show();
}
else{
$('#middle').hide();
} 
   

Esto pasa por hacer las cosas rapido y sin pensar!!!

Un saludo!