1
在索引中，我有一個導航菜單，帶我訪問網站的每個頁面。一旦我點擊並進入該頁面，一切看起來都很完美。通過Javascript更改CSS屬性
index.html的導航
<nav class="masthead-menu" id="masthead-menu">
<ul class="masthead-menu__list">
<li class="masthead-menu__item"><a class="current" href="index.html">Home</a></li>
<li class="masthead-menu__item"><a href="tratamientos.html">Tratamientos</a></li>
<li class="masthead-menu__item"><a href="profesionales.html">Profesionales</a></li>
<li class="masthead-menu__item"><a href="clinica.html">La Clínica</a></li>
<li class="masthead-menu__item"><a href="contacto.html">Contacto</a></li>
</ul>
</nav>
然後，我有在指數一系列環節和他們每個人帶我到位於不同頁面的索引不同標籤的代碼，這是tratamientos 。 HTML
的index.html中的鏈接代碼
<article class="service">
<div class="service-content">
<h3 class="service-title">Implantología</h3>
<p class="service-excerpt">La pérdida de piezas, provoca disfunciones en los dientes y genera graves problemas bucodentales.</p>
<a href="tratamientos.html#tab-1" class="btn-link">Saber Más</a>
</div>
<img src="images/implantologia_700.jpg" alt="Implantología" class="service-img">
</article>
<article class="service">
<div class="service-content service-content__left">
<h3 class="service-title">Endodoncia</h3>
<p class="service-excerpt">La endodoncia se aplica cuando la pulpa dental enferma (se inflama) como consecuencia de una caries profunda, una enfermedad periodontal, un traumatismo, etc.</p>
<a href="tratamientos.html#tab-2" class="btn-link">Saber Más</a>
</div>
<img src="images/endodoncia_700.jpg" alt="Endodoncia" class="service-img service-img__left">
</article>
<article class="service">
<div class="service-content">
<h3 class="service-title">Periodoncia</h3>
<p class="service-excerpt">La enfermedad periodontal afecta a las encías y al ligamento que sujeta los dientes a los maxilares.</p>
<a href="tratamientos.html#tab-3" class="btn-link">Saber Más</a>
</div>
<img src="images/periodoncia_700.jpg" alt="Periodoncia" class="service-img">
</article>
<article class="service">
<div class="service-content service-content__left">
<h3 class="service-title">Conservadora</h3>
<p class="service-excerpt">Abarca la prevención, diagnóstico y tratamiento de la caries dental desde la mínima destrucción de tejido hasta las grandes restauraciones.</p>
<a href="tratamientos.html#tab-4" class="btn-link">Saber Más</a>
</div>
<img src="images/conservadora_700.jpg" alt="Conservadora" class="service-img service-img__left">
</article>
<article class="service">
<div class="service-content">
<h3 class="service-title">Estética Dental</h3>
<p class="service-excerpt">Hoy en día, la sonrisa es una parte importante de nuestra imagen de cara a otras personas. Además, la sonrisa puede llegar a ser importante en algunas profesiones.</p>
<a href="tratamientos.html#tab-5" class="btn-link">Saber Más</a>
</div>
<img src="images/estetica_700.jpg" alt="Estética Dental" class="service-img">
</article>
<article class="service">
<div class="service-content service-content__left">
<h3 class="service-title">Ortodoncia</h3>
<p class="service-excerpt">Gracias a las ortodoncias podemos corregir el posicionamiento en los arcos dentales de forma que se pueda masticar correctamente y configurar una estética optima.</p>
<a href="tratamientos.html#tab-6" class="btn-link">Saber Más</a>
</div>
<img src="images/ortodoncia_700.jpg" alt="Ortodoncia" class="service-img service-img__left">
</article>
這是tratamientos.html代碼
<div class="tabs tabs--lg">
<ul class="tabs__list">
<li class="tabs__item tabs__item--active">
<a href="#tab-1" class="tabs__link">Implantología</a>
</li>
<li class="tabs__item">
<a href="#tab-2" class="tabs__link">Endodoncia</a>
</li>
<li class="tabs__item">
<a href="#tab-3" class="tabs__link">Periodoncia</a>
</li>
<li class="tabs__item">
<a href="#tab-4" class="tabs__link">Conservadora</a>
</li>
<li class="tabs__item">
<a href="#tab-5" class="tabs__link">Estética Dental</a>
</li>
<li class="tabs__item">
<a href="#tab-6" class="tabs__link">Ortodoncia</a>
</li>
</ul>
<div class="tabs__content">
<div id="tab-1" class="tabs__area tabs__area--active">
<div class="panel-row">
<div class="panel-row__text">
<h3>Implantología Dental</h3>
<p>La implantología dental es la disciplina de la odontología que tiene como objetivo sustituir dientes perdidos mediante la colocación quirúrgica de un implante en el hueso maxilar o mandibular.</p>
<p>Los implantes dentales pueden ser de diferentes tamaños, superficies y materiales. Sobre los implantes se diseñan las rehabilitaciones protéticas que van a permitir restituir las funciones masticatorias, fonéticas y estéticas del paciente.</p>
<p>La elección del tipo de implante se realiza en función del diagnóstico, pronóstico y del plan de tratamiento interdisciplinario entre el odontólogo general con un especialista en cirugía, periodoncia y prostodoncia.</p>
<p>Actualmente la mayoría de los implantes intraóseos se fabrican con materiales altamente biocompatibles como el titanio, que le permite una unión al hueso biológicamente estable denominada osteointegración.</p>
</div>
<div class="panel-row__img">
<img src="images/implante_dental.jpg" alt="Implante dental">
</div>
</div>
<div class="panel-row reverse">
<div class="panel-row__text">
<h3>Cirugía Oral</h3>
<p>La cirugía del tercer molar o muela del juicio es la más frecuente. Su exodoncia se realiza en los casos en los que dan sintomatología (dolor agudo, infecciones de repetición, caries en los segundos molares por dificultad de higiene, etc) o se encuentra algún signo radiológico patológico (algún quiste o erosión de raíces de otras piezas).</p>
</div>
<div class="panel-row__img">
<img src="images/cirugia_dental.jpg" alt="Cirugía dental">
</div>
</div>
</div>
<div id="tab-2" class="tabs__area">
<div class="panel-row">
<div class="panel-row__text">
<h3>Endodoncia</h3>
<p>En el caso de dientes severamente afectados por diversas circunstancias como pueden ser caries profundas, traumatismos o infecciones, se realiza previamente a la restauración, la endodoncia.</p>
<p>La endodoncia es el tratamiento de conductos radiculares, esto corresponde a toda terapia que es practicada en el complejo dentino-plupar de un diente. La terapia endodóntica consiste en la extirpación parcial (pulpotomías en dientes temporales) o la extirpación total de la pulpa dental (nervio-arteria-vena).</p>
</div>
<div class="panel-row__img">
<img src="images/instrumental.jpg" alt="Instrumental">
</div>
</div>
<div class="panel-row reverse">
<div class="panel-row__text">
<h3>Patología periapical</h3>
<p>La periodontitis apical es un proceso inflamatorio del periodonto apical y/o lateral del diente. El objetivo de la endodoncia es prevenir y/o curar la periodontitis apical.</p>
<p>En algunos casos hay que complementar la endodoncia con tratamiento quirúrgico denominado apicectomía.</p>
</div>
<div class="panel-row__img">
<img src="images/periapical.jpg" alt="Patología periapical">
</div>
</div>
</div>
<div id="tab-3" class="tabs__area">
<div class="panel-row">
<div class="panel-row__text">
<h3>Periodoncia</h3>
<p>La periodoncia es la especialidad odontológica que estudia la prevención, diagnóstico y tratamiento de las enfermedades y condiciones que afectan los tejidos que dan soporte a los dientes, para el mantenimiento de la salud, función y estética de los dientes y sus tejidos adyacentes.</p>
<p>Las principales enfermedades periodontales que afectan a la dentición son la periodontitis y la gingivitis.</p>
<p>La enfermedad periodontal se manifiesta como un gingivitis (inflamación y sangrado de la encía sin afectar el hueso) o periodontitis, donde ocurre la destrucción de hueso que soporta el diente.</p>
<p>Si no es tratado a tiempo puede ocasionar la pérdida de los dientes.</p>
</div>
<div class="panel-row__img">
<img src="images/periodoncia.jpg" alt="Periodoncia">
</div>
</div>
<div class="panel-row reverse">
<div class="panel-row__text">
<h3>Prevención</h3>
<p>La prevención y el diagnóstico precoz son fundamentales en la enfermedad periodontal. Una encía sana nunca sangra, si existe sangrado es un motivo para acudir a tu odontólogo.</p>
<p>Así mismo se convierten en buenos aliados para nuestra higiene dental, como complemento al cepillado de dientes, el uso de cepillos interdentales y la seda dental.</p>
</div>
<div class="panel-row__img">
<img src="images/prevencion.jpg" alt="Prevención">
</div>
</div>
</div>
<div id="tab-4" class="tabs__area">
<div class="panel-row">
<div class="panel-row__text">
<h3>Odontología General</h3>
<p>En Odontología Cazorla cuidamos de tu salud.</p>
<p>La caries constituye la enfermedad crónica más frecuente en el ser humano. Es una enfermedad infecciosa multifactorial que todos padecemos en mayor o menor medida y que afecta a los tejidos duros de los dientes.</p>
<p>En el tratamiento de caries, después de la eliminación y desinfección, restauramos com composite de última generación, que garantizan la funcionalidad y la estética de la obturación.</p>
<p>Entre las cualidades de estos materiales podemos mencionar su elevada resistencia, su nula toxicidad y su aspecto totalmente natural y estético que iguala por completo el color y brillo natural del diente.</p>
</div>
<div class="panel-row__img">
<img src="images/odontologia-general.jpg" alt="Odontología General">
</div>
</div>
<div class="panel-row reverse">
<div class="panel-row__text">
<h3>Prótesis Dental</h3>
<p>El pricipal objetivo de una prótesis dental es recuperar la funcionalidad de la boca, aunque no es lo único. Toda prótesis, sea del tipo que sea, debe tener un sistema de retención eficiente, es decir, que la restauración se mantenga sujeta en la boca, ya que de no ser así la masticación, deglución y fonética, se verán afectadas.</p>
<p>Existen diversos tipos de prótesis dentales y cada una de ellas seran las indicadas según las necesidades del paciente. En término genéricos hablamos de dos tipos de prótesis, fija y removible.</p>
</div>
<div class="panel-row__img">
<img src="images/protesis-dental.jpg" alt="Prótesis Dental">
</div>
</div>
</div>
<div id="tab-5" class="tabs__area">
<div class="panel-row panel-row__single">
<div class="panel-row__text">
<h3>Estética Dental</h3>
<p>En la sociedad moderna se convierte en algo imprescindeible para nuestra apariencia estética tener una buena sonrisa.</p>
<p>La estética y cosmética dental comprende todos los procedimientos encaminados a corregir aquellas imperfecciones que nos impiden sentirnos a gusto con nuestros dientes.</p>
<p>Todos nuestros tratamientos se realizan siempre simulando la belleza natural de los dientes, de manera que procuramos devolver la salud oral sin olvidar el aspecto estético.</p>
<ul class="menu-list__tab">
<li>Blanqueamiento dental.</li>
<li>Carillas de porcelana.</li>
<li>Coronas de zirconio y alúmina.</li>
<li>Reconstrucciones de composite.</li>
</ul>
</div>
<div class="panel-row__img">
<img src="images/estetica-dental.jpg" alt="Estética Dental">
</div>
</div>
</div>
<div id="tab-6" class="tabs__area">
<div class="panel-row panel-row__single">
<div class="panel-row__text">
<h3>Ortodoncia</h3>
<p>Un diagnóstico certero es la clave para un buen resultado.</p>
<p>Te propondremos el tratamiento de ortodoncia adecuado a tu problema y a tus necesidades.</p>
<p>No dejes de cumplir tu sueño de tener una sonrisa bonita. Tú eliges.</p>
<ul class="menu-list__tab">
<li>Ortodoncia convencional con brackets metálicos y cerámicos (estéticos)</li>
<li>Ortodoncia invisible "invisalign"</li>
<li>Ortopedia dentofacial</li>
</ul>
</div>
<div class="panel-row__img">
<img src="images/ortodoncia.jpg" alt="Ortodoncia">
</div>
</div>
</div>
</div>
</div>
我有，當我通過點擊鏈接的問題，因爲它是由錨，它將我帶到相應的錨點。然後標籤的導航菜單在頁面的導航菜單後面「隱藏」。
圖像1如圖所示，圖像2與其應該顯示的一樣。
我只需要滾動頁面一旦加載，但只有當人們點擊一個特定的鏈接，而不是泛型治療鏈接。也就是說，如果頁面的URL顯示＃tab-1，＃tab-2等，那麼我想要滾動，如果沒有，不。
代碼標籤
var app = {};
app.tabs =（函數（）{VAR 模塊= {};
module.init = function() {
var $tabs = $('.tabs');
var $tabList = $('.tabs__list');
var $tabItem = $('.tabs__item');
var $tabItemActive = $('.tabs__item--active');
var $tabLink = $('.tabs__link');
var width = $(window).width();
var tabSwitcher = function() {
// On tab link click
$tabLink.on('click', function(e) {
var currentAttrValue = jQuery(this).attr('href');
// Show/Hide Tabs
$('.tabs ' + currentAttrValue).addClass('tabs__area--active').siblings().removeClass('tabs__area--active')
// Change/remove current tab to active
$(this).parent('li').addClass('tabs__item--active').siblings().removeClass('tabs__item--active');
e.preventDefault();
});
}
var tabToggle = function() {
$tabItem.on('click', function(e) {
$(this).parent($tabList).toggleClass('tabs__list--open');
});
}
var tabController = function() {
tabToggle();
}
$(window).resize(function() {
var width = $(window).width();
if ($(window).width() != width) {
width = $(window).width();
tabController();
}
});
tabController();
tabSwitcher();
};
return module;
如何加載時，我滾動頁面
如果需要這是網頁的網址：link
在此先感謝
請具體和回答提供[最小，完全，可覈查示例]（https://stackoverflow.com/help/mcve） – bhansa