2017-02-08 3 views
1

Ich habe eine Seite Website, die URL #id oder Ankertext beim Scrollen und beim Klick auf die Navigation ändert. Ich habe ein Bild positioniert in der Mitte der Website positioniert. Die Website ist in verschiedene Abschnitte unterteilt und das Bild wird in allen Abschnitten angezeigt. Ich möchte das Bild nicht auf dem ersten Abschnitt zeigen, da es nicht mit dem Inhalt des ersten Abschnitts zusammenhängt, sondern in allen folgenden Abschnitten gezeigt wird. Wie kann ich es zum Laufen bringen?jQuery DIV verstecken/anzeigen bei Änderung des Ankertextes

Was ich bisher versucht haben, aber nicht funktioniert:

$(document).ready(function(){ 
    $(".phone").hide(); 
    var idSample = window.location.href.split("#"); 
    var id = "#"+idSample[1]; 
    if($(id) == "second"){ 
     $(".phone").show(); 
    }else{ 
     $(".phone").hide(); 
    } 
}); 

Rest in Fiddle: https://jsfiddle.net/shubhamjha1000/vh7bu32q/

Ich möchte nicht, dass Telefon im 1. Abschnitt gesehen werden, sondern auf die Erholung der Abschnitte. Bitte hilf mir Jungs!

+0

hinzugefügt Geige bekommen .. bitte prüfen .. –

+0

Beachten Sie, dass Sie nicht jquery der Geige hinzugefügt haben und druckt es Fehler ... –

+0

Dank für die Korrektur .. hinzugefügt .. –

Antwort

0

Sie können die in diesem question schriftliche Antwort benutzen, um Änderungen in dem Fenster zu hören sehen, welche URL Sie auf und zeigen oder das Telefon entsprechend verstecken ....

Beispiel:

$(function(){ 

    // Bind the event. 
    $(window).hashchange(hashchanged); 

    // Trigger the event (useful on page load). 
    hashchanged(); 

}); 

function hashchanged(){ 
var hash = location.hash.replace(/^#/, ''); 
//your code 
if(hash == "#first") { 
    // Hide element 
    } else { 
    // Show element 
    } 
} 

Aber auch wenn das, was Sie vorhaben, funktioniert mit dieser Lösung Ich denke, es würde immer noch schlecht aussehen auf der App selbst und anstelle eines schwebenden Telefons können Sie vielleicht das Telefon als ein IMG in den relevanten Containern erstellen und verstecken und zeigen mit ID ...

0

Sie können einfach ein substring auf Ihrem location.hash verwenden für Ihre Hash-Tag

$(document).ready(function(){ 
    $(".phone").hide(); 

    var id = window.location.hash.substr(1); 

    if($(id) == "second"){ 
     $(".phone").show(); 
    }else{ 
     $(".phone").hide(); 
    } 
}); 
Verwandte Themen