Amigos , un favor ayudenme a corregir este code..es solo un slider en jquery, me funciona normal en local pero cuando lo subo a hosting no se mueve el slider...pienso que es poque el hosting esta en linux..lo supongo porque es sensible a las carpetas en mayuscylas y minusculas ,en realidad esta superdesordenado ;D ;D, solo es un demo que iba pulir una vez puesto en funcionamiento, gracias por su tiempo
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
@font-face {
font-family: AvantGardeBookBT;
src: url(fonts/AvantGardeBookBT.ttf);
}-->
@font-face {
font-family: Elgar;
src: url(fonts/Elgar.ttf);
}-->
.foot{
background-color:#000;
width: 100%;
height: 100px;
margin: auto;
margin-top:20px
}
</style>
<title>Comic</title>
<meta name="viewport" contet="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="framework/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="framework/css/menu.css">
<link rel="icon" type="image/png" href="/images/icono.png">
<script type="text/javascript" src="js/lib/jquery.js"></script>
<script type="text/javascript" src="framework/js/bootstrap.min.js"></script>
<!-- para slider -->
<link rel="stylesheet" type="text/css" href="css/sliders.css">
</head>
<body style="zoom: 1; background-color: rgb(0, 0, 0);">
<div class="container" style="width:95%; background-color:#FFF">
<!-- fin del row cabecera-->
<div class="row" style="padding-top:25px; padding-bottom:15px; background-color:#000">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style=" background-image:url(images/nada.png); background-repeat:no-repeat;" align="center">
<a href="./Lore's Beauty_files/Lore's Beauty.html"><img src="images/logo.png" alt="logo" class="img-responsive"></a>
</div>
</div> <!-- fin del row cabecera-->
<div class="row"> <!-- inicuio del row menu-->
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style="background-color:#000" >
<div class="navbar navbar-default navbar-static-top" >
<div class="contaginer" >
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.php">Inscribete!</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a class="navbar-brand" href="salon.php">Suscripciones</a></li>
<li><a class="navbar-brand" href="loguin.php">loguin</a></li>
</ul>
</div>
</div>
</div>
</div>
</div><!-- fin del row menu-->
<div class="row" align="center"> <!-- inicio row slider-->
<!-- SLIDERSSSS-->
<div id="carousel1" class="carousel slide" data-ride="carousel" style="height:500px " >
<div class="carousel-inner">
<div class="item active" style="height:500px; width:1200px;">
<img alt="Bootstrap template" src="images/sliders/slider005.jpg">
</div>
<div class="item" style="height:500px; width:1200px">
<img alt="Bootstrap template" src="images/sliders/slider001.jpg">
</div>
<div class="item" style="height:500px; width:1200px">
<img alt="Bootstrap template" src="images/sliders/slider004.jpg">
</div>
<div class="item" style="height:500px; width:1200px">
<img alt="Bootstrap template" src="images/sliders/slider002.jpg">
<div class="carousel-caption">
</div>
</div>
<div class="item" style="height:500px; width:1200px">
<img alt="Bootstrap template" src="images/sliders/slider003.jpg">
<div class="carousel-caption">
</div>
</div>
</div>
</div><!-- FIN DE SLIDERS-->
</div><!-- fin del row slider-->
<!-- inicio capitulos -->
<div class="row" style="padding-top:15px; background-color: #1e1e1e">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" align="center" style="color:#FFF">
<h2>Historias sacadas de la vida real</h2>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" align="center">
<br>
<a href="comicfinal.php?hist=1&capt=1"><img src="images/portada.jpg" class="img-responsive" style="background-color:#AF8788; width:100%; border-color: #555555;border-width: 6px; border-style: solid"></a>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" align="center" >
<br>
<a href="comicfinal.php?hist=1&capt=1"><img src="images/portada1.jpg" class="img-responsive" style="background-color:#AF8788; width:100%; border-color: #555555;border-width: 6px; border-style: solid"></a>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" align="center" >
<br>
<a href="comicfinal.php?hist=1&capt=1"><img src="images/portada2.jpg" class="img-responsive" style="background-color:#AF8788; width:100%; border-color: #555555;border-width: 6px; border-style: solid"></a>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" align="center" >
<br>
<a href="comicfinal.php?hist=1&capt=1"><img src="images/portada4.jpg" class="img-responsive" style="background-color:#AF8788; width:100%; border-color: #555555;border-width: 6px; border-style: solid"></a>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" align="center" >
<br>
<a href="comicfinal.php?hist=1&capt=1"><img src="images/portada5.jpg" class="img-responsive" style="background-color:#AF8788; width:100%; border-color: #555555;border-width: 6px; border-style: solid"></a>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" align="center" >
<br>
<a href="comicfinal.php?hist=1&capt=1"><img src="images/portada3.jpg" class="img-responsive" style="background-color:#AF8788; width:100%; border-color: #555555;border-width: 6px; border-style: solid"></a>
</div>
<!-- final mascarillas -->
<!-- inicio capitulos -->
<div class="row" style="padding-top:15px">
</div>
<!-- final mascarillas -->
<!-- inicio del pie-->
<div class="row">
<div class="foot" style="color:#FFF" align="center">
<br><br><p>Copyright © 2015 Historias Perú | <a href="mailto:historia@hotmail.com" target="_top">
historia@hotmail.com</a>| RPM #917851518</p>
</div>
</div>
<!-- fin del pie-->
</div> <!-- fin del contenedor-->
<script type="text/javascript">
jQuery(function ($) {
$('#carousel1').carousel({
interval:2000
});
var clickEvent = false;
$('#carousel1').on('click', '.nav a', function () {
clickEvent = true;
$('.nav li').removeClass('active');
$(this).parent().addClass('active');
}).on('slid.bs.carousel', function (e) {
if (!clickEvent) {
var count = $('.nav').children().length - 1;
var current = $('.nav li.active');
current.removeClass('active').next().addClass('active');
var id = parseInt(current.data('slide-to'));
if (count == id) {
$('.nav li').first().addClass('active');
}
}
clickEvent = false;
});
});
</script>
</body></html>
Pues el código en realidad no ayuda de nada, más bien ubicación de carpetas.
¿Has comprobado que todos los archivos se cargan? Abre el código fuente de la página y dale click al link de los archivos y si se abren es que se cargan bien y no hay ningún problema con la ubicación.
Te recomiendo que empieces a usar la consola del navegador para desarrollar las páginas. Es imprescindible para saber que es lo que falla.
<title>Comic</title>
<meta name="viewport" contet="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="framework/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="framework/css/menu.css">
<link rel="icon" type="image/png" href="/images/icono.png">
<script type="text/javascript" src="js/lib/jquery.js"></script>
<script type="text/javascript" src="framework/js/bootstrap.min.js"></script>
<!-- para slider -->
<link rel="stylesheet" type="text/css" href="css/sliders.css">
Acostumbrate a usar siempre la barra vertical al principio de las rutas, "/" indica el document root, donde tienes el index. O si estás dentro de un subdirectorio puedes usar "./" y eso indica que es donde está el archivo y no el root.
<title>Comic</title>
<meta name="viewport" contet="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/framework/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="/framework/css/menu.css">
<link rel="icon" type="image/png" href="/images/icono.png">
<script type="text/javascript" src="/js/lib/jquery.js"></script>
<script type="text/javascript" src="/framework/js/bootstrap.min.js"></script>
<!-- para slider -->
<link rel="stylesheet" type="text/css" href="/css/sliders.css">
No a unas si y a otras no ;D
Configura tu editor de código para que el tabulador use 4 espacios, así tu código no se deformará cuando lo pegues en otras partes.
Gracias por su tiempo
bueno, las imagenes cargan, bien sin problema
el problema es que al poner el "/" por ejemplo "/framework..." ya no me reconoce las rutas ni de los css.
Es raro porque este codigo si me funciono a nivel local..
Pues le quitas la barra , donde está el problema? :xD :xD
Debe ser por configuraciones del servidor. Tambien puedes probar con './' en lugar de '/'
S2