1
私は仕事中にjQueryでスクリプトを書くことを学んでいますが、2つの問題があります。私はJavascriptやプログラミングの基礎（それのために申し訳ありません）の専門家ではないので、スクリプト間に何らかの矛盾があるかどうかはわかりません。2つのスクリプトが連携していません
私はあなたが私を助けてくれることを頼んでいます。今は必死だからです。
これは、両方のスクリプトがhttp://www.ufv.es/beli（青いボタンが表示されるまでスクロールする）のページです。
最初のスクリプトは、クリックしたボタンに応じて、ページの右側に異なるコンテンツを読み込みます。
秒1は、それは私がお見せするために作成され、この他のページ上で動作と同じように、「Claustro docente」ボタン内で動作するようになっている：http://www.ufv.es/beli2
私は多くのミスを作ってるんだと確信しています、しかしもしあなたが私を助けてくれたら...ありがとう！
$(document).ready(function() {
\t jQuery('.grados-content').hide();
\t jQuery('#grados-contenido').html(jQuery('#grados-content1').html());
\t divContenido = jQuery('.grado-item', this).children('.grados-content');
\t $('.grado-item',this).click(function(e){
e.preventDefault();
\t \t jQuery('#grados-contenido').html(jQuery(this).children('.grados-content').html());
\t $(this).addClass('grado-seleccionado');
$('.grado-item').not(this).removeClass('grado-seleccionado');
});
var curentProfe = 0;
var totalProfes = $('#profes').children().length;
function showBigProfe(profeDiv) {
var RutaImagen = $(profeDiv).children('img').attr('src');
var titulo = $(profeDiv).find('h3').html();
var subti = $(profeDiv).find('.masinfo').html();
var profeweb = $(profeDiv).find('.webenlace').attr('href');
var profemail = $(profeDiv).find('.mailenlace').attr('href');
var linkedin = $(profeDiv).find('.linkedinenlace').attr('href');
var researchgate = $(profeDiv).find('.researchgate').attr('href');
var facebook = $(profeDiv).find('.facebookenlace').attr('href');
var twitter = $(profeDiv).find('.twitterenlace').attr('href');
$('#grande').fadeIn();
$('#conteneprof').children('img').attr('src', RutaImagen);
$('.infocontenido').children('h3').html(titulo);
$('.bio').html(subti);
if (profeweb == '#') {
$('#iconoweb').css('display', 'none');
} else {
\t $('#iconoweb').css('display', 'inline-block');
$('.infocontenido').children('.webenlace').attr('href', profeweb);
}
\t \t if (profemail == '#'){
\t $('#iconomail').css('display', 'none');
} else{
\t $('#iconomail').css('display', 'inline-block');
$('.infocontenido').children('.mailenlace').attr('href', profemail);
}
\t \t if (linkedin == '#'){
\t $('.linkedinenlace').css('display', 'none');
} else {
\t $('.linkedinenlace').css('display', 'inline-block');
$('.infocontenido').children('.linkedinenlace').attr('href', linkedin);
}
\t \t if (researchgate == '#'){
\t $('.researchgate').css('display', 'none');
} else {
\t $('.researchgate').css('display', 'inline-block');
$('.infocontenido').children('.researchgate').attr('href', researchgate);
}
\t \t if (facebook == '#'){
\t $('.facebookenlace').css('display', 'none');
} else {
\t $('.facebookenlace').css('display', 'inline-block');
$('.infocontenido').children('.facebookenlace').attr('href', facebook);
}
\t \t if (twitter == '#'){
\t $('.twitterenlace').css('display', 'none');
} else {
$('.twitterenlace').css('display', 'inline-block');
$('.infocontenido').children('.twitterenlace').attr('href', twitter);
}
}
$('.profe', this).mouseenter(function() {
$('.infoprof', this).fadeIn(600).css('z-index', '1');
});
$('.profe', this).mouseleave(function() {
$('.infoprof', this).fadeOut(600);
});
$('.fa-times, #grande').click(function() {
$('#grande').fadeOut();
});
$('#conteneprof').click(function(event) {
event.stopPropagation();
});
$('.profe', this).click(function() {
curentProfe = Number(this.id); \t
showBigProfe(this);
});
$('.fa-chevron-left').click(function() {
curentProfe = curentProfe - 1;
if (curentProfe < 1) {
curentProfe = totalProfes;
}
showBigProfe('#' + curentProfe);
});
$('.fa-chevron-right').click(function() {
curentProfe = curentProfe + 1;
if (curentProfe > totalProfes) {
curentProfe = 1;
}
showBigProfe('#' + curentProfe);
});
});
jQuery('.boton-redondo-llamamos').click(function(){
\t window.location.href = "http://www.ufv.es/nosotros-te-llamamos";
});#profes{
\t min-width:106%;
}
#profes .profe{
\t width:150px;
\t height:130px;
\t margin:5px;
\t float:left;
\t position:relative;
\t overflow: hidden;
\t cursor:pointer;
}
#profes .infoprof{
\t width:100%;
\t height:90px;
\t margin-top:20px;
\t background:rgba(255, 255, 255, 0.75);
\t position:absolute;
\t display:none;
}
.infoprof a{
\t text-indent:-9999px;
\t color:transparent;
}
.infoprof h3, .infoprof p{
\t position:absolute;
\t color:white;
}
.infoprof h3{
\t text-align:center;
\t text-transform:uppercase;
\t color:#003d67;
\t z-index:-1;
\t width:100%;
\t margin:0!important;
}
#profes .profe img.fotos{
\t position: absolute;
\t min-height:130px;
\t opacity:.8;
}
.profe p{
\t left:30%;
\t top:50%;
}
.masinfo{
\t display:none;
}
#grande{
\t position:fixed;
\t background-color:rgba(0,0,0,0.7);
\t width:100%;
\t height:100%;
\t top:0px;
\t left:0;
\t display:none;
\t z-index:10;
}
#conteneprof{
\t width:625px;
\t display:table;
\t padding:60px;
\t background-color:white;
\t margin:150px auto;
\t opacity:1;
\t position:relative;
\t border-radius:10px;
}
#conteneprof p{
\t color:#575950;
\t margin:5px;
}
.fa-times{
\t color:#003d67;
\t text-align:center;
\t width:24px;
\t height:24px;
\t position:absolute;
\t top:15px;
\t right:15px;
\t font-size:22px!important;
\t cursor:pointer;
\t border:3px solid transparent;
\t border-radius:30px;
\t transition:all 0.35s linear;
\t -webkit-transition:all 0.35s linear;
\t padding:2px 0 2px 5px;
}
.fa-times:hover{
\t transform:rotate(90deg);
\t -webkit-transform:rotate(90deg);
\t border:3px solid #003d67;
}
.fa-chevron-left, .fa-chevron-right{
\t position:absolute;
\t width:36px;
\t height:36px;
\t font-size:32px!important;
\t color:#003d67;
\t top:50%;
\t margin-top:-18px;
\t cursor:pointer;
\t transition:all .3s ease;
}
.fa-chevron-left:hover, .fa-chevron-right:hover{
\t color:#6fa3b6;
}
.fa-chevron-left{
\t left:10px;
}
.fa-chevron-right{
\t right:10px;
}
#conteneprof img{
\t float:left;
\t width:160px;
\t margin:5px;
\t padding:15px 0 0 45px;
}
#conteneprof .infocontenido{
\t max-width:345px;
\t margin:0 57px 0 5px;
\t float:left;
\t padding:15px 0 20px 0;
}
#conteneprof .infocontenido h3{
\t color:#003d67;
\t float:left;
\t margin:5px;
\t text-transform:uppercase;
}
#conteneprof .infocontenido p{
\t padding:0!important;
}
#conteneprof .infocontenido a.redenlace{
\t text-indent: -9999px;
\t float: left;
\t width: 27px;
\t height: 27px;
\t backface-visibility: hidden;
\t box-shadow: 0 0 1px rgba(0, 0, 0, 0);
\t position: relative;
\t transform: translateZ(0px);
\t transition-duration: 0.3s;
\t transition-property: transform;
\t vertical-align: middle;
\t border-radius: 200px 200px 200px 200px;
\t -moz-border-radius: 200px 200px 200px 200px;
\t -webkit-border-radius: 200px 200px 200px 200px;
\t display:none;
\t color:transparent;
\t margin:5px;
}
#conteneprof .infocontenido a.webenlace{
\t background: url("http://recursos.ufv.es/img/es/icono-web.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.mailenlace{
\t background: url("http://recursos.ufv.es/img/es/mail-arroba.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.linkedinenlace{
\t background: url("http://recursos.ufv.es/img/es/linkedin.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.researchgate{
\t background: url("http://recursos.ufv.es/img/es/logo-research-gate.gif") no-repeat 0 0;
}
#conteneprof .infocontenido a.facebookenlace{
\t background: url("http://recursos.ufv.es/img/es/facebook-profes.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.twitterenlace{
\t background: url("http://recursos.ufv.es/img/es/twitter.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.redenlace:before {
background: radial-gradient(ellipse at center center , rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%) repeat scroll 0 0 rgba(0, 0, 0, 0);
content: "";
height: 10px;
left: 5%;
opacity: 0;
pointer-events: none;
position: absolute;
top: 100%;
transition-duration: 0.3s;
transition-property: transform, opacity;
width: 90%;
z-index: -1;
}
#conteneprof .infocontenido a.redenlace:hover, #conteneprof .infocontenido a.redenlace:focus, #conteneprof .infocontenido a.redenlace:active {
\t transform: translateY(-5px);
\t border-radius: 200px 200px 200px 200px;
\t -moz-border-radius: 200px 200px 200px 200px;
\t -webkit-border-radius: 200px 200px 200px 200px;
}
#conteneprof .infocontenido a.redenlace:hover:before, #conteneprof .infocontenido a.redenlace:focus:before, #conteneprof .infocontenido a.redenlace:active:before {
\t opacity: 1;
\t transform: translateY(5px);
}
.infocontenido .bio{
\t max-height:200px;
\t overflow-y:scroll;
}<!DOCTYPE html>
<html lang="en">
<head>
\t <meta charset="UTF-8">
\t <title>Beli test</title>
\t <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" />
\t <link rel="stylesheet" href="beli.css">
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"> </script>
\t <script src="beli.js"></script>
\t
</head>
<body>
\t <div class="grados-menu">
\t <ul>
\t \t <li class="grado-item grado-seleccionado">
\t \t \t <a class="enlace" href="#" id="1">Presentación</a>
\t \t \t <div class="grados-content" id="grados-content1">
\t \t \t \t content1
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="2">Plan de estudios</a>
\t \t \t <div class="grados-content" id="grados-content2">
\t \t \t \t content2
\t \t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="3">Título propio: El liderazgo colaborativo en el marketing digital</a>
\t \t \t <div class="grados-content" id="grados-content3">
\t \t \t \t content3
\t \t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="4">Metodología</a>
\t \t \t <div class="grados-content" id="grados-content4">
\t \t \t \t content4
\t \t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="5">Salidad profesionales del Grado en Marketing</a>
\t \t \t <div class="grados-content" id="grados-content5">
\t \t \t \t content5
\t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="6">Claustro docente</a>
\t \t \t <div class="grados-content" id="grados-content6">
\t \t \t \t <h1>
\t \t \t \t \t Claustro docente</h1>
\t \t \t \t <br />
\t \t \t \t <p>
\t \t \t \t \t Nuestro equipo docente combina perfiles de diferentes características:</p>
\t \t \t \t <div class="lista">
\t \t \t \t \t <ul class="inline">
\t \t \t \t \t \t <li>
\t \t \t \t \t \t \t Profesionales en activo que desempeñan su actividad ajena a la Universidad y que se prestan por su vocación docente a dar clase a nuestros alumnos.</li>
\t \t \t \t \t \t <li>
\t \t \t \t \t \t \t Profesores a tiempo completo en la Universidad que son doctores en sus materias.</li>
\t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t \t <br />
\t \t \t \t <div id="profes">
\t \t \t \t \t <div class="profe" id="1">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Raquel Ayesterán</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="http://raquelayestaran.com">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://es.linkedin.com/in/raquelayestaran">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/raquel-ayesteran.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Dirección Estratégica, Marketing, Comercial y Comunicación. Doctor en Marketing Integrado 360º. Directora de Grado.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="2">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Rafael Alé Ruiz</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/rafael-ale.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Organización de Empresas. Doctor en Físicas.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="3">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Guillermo Arce</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://www.linkedin.com/in/guillermo-arce-dr-phd-2b7623b?trk=nav_responsive_tab_profile">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/guillermo-arce.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Marca, Marketing, Ventas, Redes Sociales e Internet Doctor en UAX. Experto en Estrategia de Marca.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="4">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Beatriz Duarte</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://es.linkedin.com/in/beatriz-duarte-monedero-67641682">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/beatriz-duarte.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Doctora en Ciencias Económicas y Empresariales, UCM.Analista Financiero. Responsable de Calidad del Grado en ADE.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="5">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Adolfo García</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/adolfo-garcia.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Logística, Marketing y Ventas Experiencia profesional en: MINOLTA, TNT, TELEFONICA, MAFRESA. Licenciado en Ciencias Económicas y Empresariales.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="6">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Fidel Rodríguez</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/fidel-rodriguez.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Ciencias sociales, Historia y Artes Doctor en Historia y Doctor en Sociología. Profesor universitario, UFV.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="7">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Jesús Sánchez</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/jesus-sanchez.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Comercial y Marketing en ADE+MARKETING Doctor en Derecho, Comillas. Miembro del Comité Científico del Instituto de Investigación. TheScientificCommittee oftheAnnuals of Economicand Management, Universidad Católica Juan Pablo II de Lublin-Polonia.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="8">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Francisco Solá</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/matthew-foley-ryan.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Marketing y Comunicación Licenciado en Ciencias Económicas y Empresariales, UCM. Experto en Marketing y Comunicación Publicitaria. Socio de la empresa "Acciones de Comunicación y Estrategia". Responsable de Calidad del Grado en Marketing, UFV.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="9">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Alfonso Jesús Torres</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/alfonso-jesus-torres.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Administración de empresas Licenciado en Ciencias Económicas y Empresariales, UAM. Master en Dirección Comercial y Marketing,CEI. Master en Humanidades UFV</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="profe" id="10">
\t \t \t \t \t \t <div class="infoprof">
\t \t \t \t \t \t \t <h3 class="hfoto">
\t \t \t \t \t \t \t \t Inmaculada Puebla</h3>
\t \t \t \t \t \t \t <a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://es.linkedin.com/in/inmaculada-puebla-a398ba46">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
\t \t \t \t \t \t <img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/inmaculada-puebla.jpg" />
\t \t \t \t \t \t <div class="masinfo">
\t \t \t \t \t \t \t <p>
\t \t \t \t \t \t \t \t <strong>Área: </strong>Tecnologías de la Información y Comunicación, Ventas, Marketing, Gestión Empresarial, Gamificación, Matemáticas etc. Doctora en Humanidades, UFV. Licenciada en Ciencias Físicas, especialidad Informática por la UCM. Máster de finanzas y marketing UPM. Alta experiencia en empresas tecnológicas.</p>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t \t <div class="clear">
\t \t \t \t \t </div>
\t \t \t \t <div id="grande">
\t \t \t \t \t <div id="conteneprof">
\t \t \t \t \t \t <i class="fa fa-times"> </i> <i class="fa fa-chevron-left"> </i> <i class="fa fa-chevron-right"> </i> <img />
\t \t \t \t \t \t <div class="infocontenido">
\t \t \t \t \t \t \t <h3>
\t \t \t \t \t \t \t \t </h3>
\t \t \t \t \t \t \t <div class="clear">
\t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t <a class="redenlace webenlace" href="#" id="iconoweb" target="blank_">a</a> <a class="redenlace mailenlace" href="#" id="iconomail" target="blank_">a</a> <a class="redenlace linkedinenlace" href="#" id="iconoli" target="blank_">a</a> <a class="redenlace researchgate" href="#" id="iconorg" target="blank_">a</a> <a class="redenlace twitterenlace" href="#" id="iconotw" target="blank_">a</a> <a class="redenlace facebookenlace" href="#" id="iconotw" target="blank_">a</a>
\t \t \t \t \t \t \t <div class="clear">
\t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t \t <div class="bio">
\t \t \t \t \t \t \t \t </div>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="7">Perfil internacional del Grado en Marketing</a>
\t \t \t <div class="grados-content" id="grados-content7">
\t \t \t \t content7
\t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="8">Alumni</a>
\t \t \t <div class="grados-content" id="grados-content8">
\t \t \t \t content8
\t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="9">Vive la UFV</a>
\t \t \t <div class="grados-content" id="grados-content9">
\t \t \t \t content9
\t \t \t </div>
\t \t </li>
\t \t <li class="grado-item">
\t \t \t <a class="enlace" href="#" id="10">Calidad y mejora del título</a>
\t \t \t <div class="grados-content" id="grados-content10">
\t \t \t \t content10
\t \t \t </div>
\t \t </li>
\t </ul>
</div>
<div id="grados-contenido">
\t </div>
</body>
</html>
「最初のスクリプト」とはどのコードが2番目のコードですか？ – Pointy
なぜ '$（ '。grado-item'、this）.click'関数を2回使用していますか？ –
あなたのhtmlとcssでそれを作成してください。コードをデバッグするのに役立ちます。 – Darkrum