Ayuda para hacer una pagina web

Archivado
Hola, pido ayuda para una pagina web sencilla, es para crear como un menu para las partidas de rol y tener todo dandole al index.html, pero quiero hacer lo siguiente.

Tengo ya la base creada, todo bien, y ahora quiero que por ejemplo pinche "Armaduras" y que al pinchar, abajo salga un txt ya preparado con la informacion y se refleje alli

EJEMPLO:

Yo estoy en index que se ve de esta manera

EZIRIA, LA MALDICION DE KRENK
ARMADURAS - ARMAS - TATATA....

Ahora clickeo en Armaduras y sin tener que ir a otro enlace de web me salga:

EZIRIA, LA MALDICION DE KRENK
ARMADURAS - ARMAS - TATATA....
ARMADURAS PESADAS
ARMADURA DE HIERRO
USADA POR SER LA MAS ECONOMICA Y RESISTENTE... 3/3

ARMADURAS DE TAL.

y ahora pincho Armas, y sin cambiar de enlace teniendo otro txt llamado "Armas.txt" me salga la informacion de las armas, y asi sucesivamente.

yo se que lo hice hace ya 4 años pero ya no me acuerdo y por eso pido ayuda a ver si me decis la etiqueta y como iba esa etiqueta, muchas gracias de antemano.

voy a adjuntar aparte para que veais como voy, como digo quiero dejar solo el index y tener que evitar poner tanto archivo html.

https://www.dropbox.com/s/en1p6gkhd6uarap/Eziria1.zip

gracias de antemano y saludos! [beer]
Si no he entendido mal quieres que se vaya mostrando el texto de un .txt sin tener que recargar la página. Eso se hace con AJAX. Para hacerlo más fácil usa jQuery. Con un par de líneas lo tienes hecho.
Alecs7k escribió:Si no he entendido mal quieres que se vaya mostrando el texto de un .txt sin tener que recargar la página. Eso se hace con AJAX. Para hacerlo más fácil usa jQuery. Con un par de líneas lo tienes hecho.


se puede implementar al html?, y como seria? gracias de antemano!
un div que se encuentre debajo que cargue la info (cada info será un html diferente que se carga dentro de ese div).
exitfor escribió:un div que se encuentre debajo que cargue la info (cada info será un html diferente que se carga dentro de ese div).


me podrias poner un ejemplo?? gracias!
PHP, es lo que tienes que hacer. hacer eso en html es muy costoso y la la larga aun mas, llegara un momento que para cambiar una sola linea tendras que modificar todos los html.
lo malo es que php hace 5 años que no lo uso, por eso pido algun ejemplo sencillo, para yo saber como iria el tema

saludos!
te recomendaría que usaras alguna página de las gratuitas que hay por internet, ej: wix.
WATERPARTY escribió:te recomendaría que usaras alguna página de las gratuitas que hay por internet, ej: wix.


pero es que la cuestion es que no quiero subirlo a un servidor, ya que es mas como un programa para ir dandole a los botones y me aparezcan las cosas, por eso quiero evitar subirlo a un servidor.

Saludos
A lo que se refiere el compañero es que tengas 2 divs uno pequeño que será donde metas las secciones y luego justo debajo el grande en el cual se verá el contenido. Y es algo bastante sencillo que tenias que usar el "href" y poco más para hacerlo. Te haría un crokis pero desde el móvil no puedo hacer nada.

Saludos y espero haberte ayudado
Aquí te enseñan como cargar un .txt dentro de un div http://stackoverflow.com/questions/6470 ... t-into-div al pulsar un boton con id="lesen".

Tan solo tienes que crear los distintos botones para cada cosa que quieras cargar y los .txt. Es la forma más fácil a no ser que quieras usar PHP.
he probado y nada no me funciona... ¿donde fallo?

<HTML>
   <HEAD>
      <TITLE>EZIRIA, LA MALDICION DE KRENK</TITLE>
   </HEAD>
   
   <?php
   $(document).ready(function() {
    $("#Armaduras").click(function() {
        $.ajax({
            url : "armaduras.txt",
            dataType: "text",
            success : function (data) {
                $(".txt").html(data);
            }
        });
    });
});
   ?>
<BODY BACKGROUND="DATA/IMG/fondo.jpg" LINK="BLACK" VLINK="BLACK" ALINK="BLACK" STYLE="cambria">
<FONT FACE="CAMBRIA">
<TABLE WIDTH="100%" BACKGROUND="DATA/IMG/1.png">
   <TR>
      <TD COLSPAN="10" TOPMARGIN="10"><H1><P ALIGN="CENTER"><A HREF="INDEX.HTML">EZIRIA, LA MALDICION DE KRENK</A></P></TD>
   </TR>
   <TR>
      <TD><div class="button"><input type="button" id="Armaduras" value="ARMADURAS"/></div></A></TD>
      <TD><A HREF="ARMAS.HTML">ARMAS</A></TD>
      <TD><A HREF="CLASES.HTML">CLASES</A></TD>
      <TD><A HREF="HABILIDADES.HTML">HABILIDADES</A></TD>
      <TD><A HREF="LUGARES.HTML">LUGARES</A></TD>
      <TD><A HREF="MUSICA.HTML">MUSICA</A></TD>
      <TD><A HREF="OBJETOS.HTML">OBJETOS</A></TD>
      <TD><A HREF="PERSONAJES.HTML">PERSONAJES</A></TD>
      <TD><A HREF="RAMAS.HTML">RAMAS</A></TD>
      <TD><A HREF="RAZAS.HTML">RAZAS</A></TD>
   </TR>
   <TR>
      <TD>
      <div class="text">
         Lorem Ipsum <br/>
      </div>
      </TD>
   </TR>
</TABLE>
</FONT>
</BODY>
</HTML>
Pues fallas en que eso no es PHP, por lo que las etiquetas sobran y también te hará falta bajarte una versión de jQuery e importarla al html.

También tienes la opción de usar el CDN de jQuery y así no tener que bajarte los archivos, pero esto te obligará a estar conectado a internet para que te funcione:
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>


También tienes el CDN de Google:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>


EDITO:

Ten en cuenta que tienes que poner ese código entre la etiqueta <script>. Además acabo de darme cuenta que lo has puesto entre el </head> y el <body> y así no se si irá. Pon el JavaScript o dentro del head o dentro del body.
eso es lo malo es que quiero tenerlo en el portatil y ejecutarlo sin hacerme falta internet, si me obliga a tener internet conectado no le veo factible :(

saludos
Kirby Konata escribió:eso es lo malo es que quiero tenerlo en el portatil y ejecutarlo sin hacerme falta internet, si me obliga a tener internet conectado no le veo factible :(

saludos


Es que nadie te dice que estés obligado a tener internet. Si no quieres tener internet simplemente te bajas el archivo jquery.js, lo metes en tu carpeta, lo llamas desde el HTML y listo. Te haría falta internet si decides usar el jquery que está alojado en servidores de terceros.

EDITO: Ya te lo he hecho yo.

Aquí el código HTML y el JS para cargar los txt. También he puesto un html para cargarlo que es bastante mejor, no solo es texto plano, sino que te permite darle un poco de formato.
<html>
<head>
<title>Ejemplo</title>
<script src="jquery-1.10.2.min.js"></script>
<script type="text/javascript">
   $(document).ready(function() {
       $("#armaduras").click(function() {
             $(".text").load("armaduras.txt");
       });
       $("#armas").click(function() {
          $(".text").load("armas.txt");
       });
       $("#pruebahtml").click(function() {
          $(".text").load("prueba.html");
       });
    });
</script>
</head>
<body>

<input type="button" id="armaduras" value="Armaduras">
<input type="button" id="armas" value="Armas">
<input type="button" id="pruebahtml" value="Prueba HTML">


<div class="text">


</div>

</body>


Armaduras.txt:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Armas.txt:
Texto de prueba para las armas. Texto de prueba para las armas. Texto de prueba para las armas. Texto de prueba para las armas.
Texto de prueba para las armas.
Texto de prueba para las armas.


prueba.html:
<h1>Título de la prueba</h1>

<p>Es mejor cargar un archivo HTML que un .txt porque con HTML le puedes dar un poco de formato al texto</p>

<p>Podrás hacer párrafos, tablas, títulos, etc</p>

<p style="color:red">Incluso le puedes dar color</p>


Y listo. Solo es eso. Tan solo he tenido que descargar el archivo jquery.js, meterlo en la carpeta y llamarlo desde el HTML. Y para que veas lo bueno que soy, te subo la carpeta con todo.

Adjuntos

HTML.zip (32.75 KB)

vaya muchisimas gracias ^^ me lo he bajado y ya mañana lo testeo y te cuento ^^

saludos =3
(mensaje borrado)
holaa

alecs he probado tu index pero no carga ningun txt, ¿me faltara instalar algo? no he tocado nada unicamente lo he descomprimido en el escritorio

saludos
Funciona perfecto!, Estás corriendo el servidor apache o lo que uses? o lo abres con el navegador y no permites datos externos?

Probado en Google Chrome e Internet Explorer 10
luciferfran escribió:Funciona perfecto!, Estás corriendo el servidor apache o lo que uses? o lo abres con el navegador y no permites datos externos?

Probado en Google Chrome e Internet Explorer 10


yo lo uso con el chrome no uso apache porque no quiero ponerlo en un servidor, y si permite datos externos :S porque yo eso no lo toco ya que funciona bien y no tengo que modificar nada del navegador

saludos
¿Al final te ha funcionado o no?

No necesita nada para correr, no usa AJAX, solamente carga el archivo, así que no necesita ningún tipo de servidor.
nada [mamaaaaa] le doy a los botones de tu index y no sale absolutamente nada [snif]
Prueba con Internet Explorer, a mi con Chrome directamente no, pero si lo hago con Apache me funciona con cualquier navegador
si con el IE me funciona, muchas gracias, ¡mañana a ponerme manos a la obra ^^!

saludos!
Pues no tiene sentido que vaya con un navegador sí y con otro no. ¿Con Firefox os funciona?
24 respuestas
Archivado
Volver a General