¿Cómo implementar el salto de página web?
¡Solo usa ventanas emergentes!
ltscript language="javascript" gt
lt! -
ventana.open ('page.html ')
- gt;
lt/SCRIPT gt;
Porque esto es Un fragmento de código javascript, por lo que deben colocarse en
Window.open ('page.html ') para controlar la ventana emergente de la nueva ventana page.html. Si page.html no está en la misma ruta que la ventana principal, la ruta debe declararse antes, que puede ser una ruta absoluta (http://) o una ruta relativa (../).
Se pueden usar comillas simples y dobles, pero no las mezcle.
Este código se puede agregar en cualquier parte del HTML y agregarse a
la ventana emergente posterior a la configuración.
Primero hablemos de la configuración de la apariencia de la ventana emergente. Simplemente agregue algo al código anterior.
Personalicemos la apariencia, el tamaño y la posición de la ventana emergente para que se ajuste a las características específicas de esta página.
lt scripting language = " JavaScript: gt;
lt! -
window.open ('page.html', 'newwindow', 'height= 100, ancho=400, arriba=0, izquierda=0, barra de herramientas=no, barra de menú=no, barras de desplazamiento=no, redimensionable=no,
posición=no, estado=no')
Archivo: //Escribir en una línea
- gt;
lt/SCRIPT gt;
Explicación de parámetros:
ltScript language = "javascript" inicio del script gtJs;
El comando Window.open abre una nueva ventana;
page.html muestra el nombre del archivo de la nueva ventana;
El nombre de la nueva ventana emergente (no el nombre del archivo), que se puede reemplazar con \u\u en blanco;
Altura=100 altura de la ventana;
Top=0 desde la ventana en la parte superior de la pantalla Valor de píxel;
Izquierda = 0 valor de píxel desde la ventana en el lado izquierdo de la pantalla
Barra de herramientas = No, si se muestra la barra de herramientas, sí
Barra de menú, las barras de desplazamiento representan la barra de menú y la barra de desplazamiento;
Resizable=no si se permite cambiar el tamaño de la ventana, sí significa que sí; permitido;
Ubicación=no si se muestra la barra de direcciones, sí significa que está permitido;
Estado=no si se muestra la información en la barra de estado (generalmente el archivo ha sido abierto), permite la selección de yes
lt/SCRIPT gt; js script end
Con función de control de ventanas emergentes
El siguiente es el código completo. .
lthtml gt
lthead gt
ltscript language = "javascript" gt
lt! -
Función openwin(){
ventana.open("page.html","newwindow","height=100,width=400,toolbar=no,menubar=no , barras de desplazamiento=no, resizable=no,
Posición=no, estado=no”
Archivo: //Escribir en una línea
}
- gt;
lt/script gt;
lt/head gt;
ltbody onload = "open win()" gt;
...Cualquier contenido de la página...
lt/body gt;
lt/html gt
Aquí se define un El la función openwin() es inútil si no se llama
Método 1:
Método 2:
Método 3: Llamar con una conexión:
Nota: El "#" utilizado es una conexión virtual.
Método 4: Llamar con un botón:
Abra el archivo en la ventana principal 1.htm. y aparecerá una pequeña ventana page.html al mismo tiempo.
Agregue el siguiente código a la ventana principal
ltScript language = "javascript" gt
Función openwin(){
ventana.open("page.html ", " ancho=200, alto=200 "
}
Archivo: //- gt;
lt/script gt;
Agregar
control de cierre cronometrado de ventanas emergentes
Controlemos la ventana emergente nuevamente, el efecto será mejor si agregamos un pequeño fragmento de código a la página emergente (tenga en cuenta que se agrega al html de page.html, no. de lo contrario...), déjelo aparecer después de 10 segundos. ¿No sería mejor cerrarlo automáticamente?
Primero, agregue el siguiente código al área
p>ltscript language = "javascript" gt
Función closeit() {
Establecer tiempo de espera ("self.close()", 10000) file://ms. /p>
}
lt/script gt;
Luego, use
para agregar un botón de cierre a la ventana emergente.
lt form gt
ltINPUT TYPE = ' BOTÓN ' valor = ' cerrar ' onClick = ' ventana .
lt/form gt; ;
Jaja, ¡ahora es aún más perfecto!
La ventana emergente está contenida en dos ventanas en una página.
Todos los ejemplos anteriores contienen dos ventanas, una es la ventana principal y la otra es una pequeña ventana emergente.
A través del siguiente ejemplo, puede completar el efecto anterior en una página.
lthtml gt
lthead gt
ltscript language = " javascript " gt
Función openwin()
{
OpenWindow=window.open("," newwin"," height=250,width=250,toolbar=no,scrollbars="scroll",menubar=no";
Archivo: //Escribir en una línea
abrir ventana . escribir(" lt; TÍTULO gt ejemplo
abrir ventana . documento . escribir(" lt; BODY BGCOLOR = # FFFFFF gt
abrir ventana documento . write(" lt; h 1 gt; ¡Hola! lt/h1
OpenWindow.document.write("¡Se ha abierto una nueva ventana! "
abrir ventana . documento . escribir(" lt;/BODY >
abrir ventana . documento . escribir(" lt;/HTML
Abrir ventana . documento .close()
}
lt/script gt;
lt/head gt
ltbody gt
lta href = " # " onclick = " abrir win()" gt; abrir ventana
ltinput type = " botón " onclick = " abrir win()" valor = " abrir ventana " >< / p>
lt/body gt;
lt/html gt;
Mira el código en OpenWindow.document.write(). escriba algunas líneas más. Asegúrese de tener en cuenta que una etiqueta más o una etiqueta menos provocará un error. Recuerde finalizar con OpenWindow.document.close()
La aplicación definitiva de ventanas emergentes<. /p> p>
Mirando hacia atrás, la ventana emergente de arriba es genial, pero hay un pequeño problema (no debes haberlo notado porque estás muy inmerso en la alegría, ¿verdad? Por ejemplo, si coloca el script anterior en una página a la que se debe acceder con frecuencia (como la página de inicio), aparecerá una ventana cada vez que se actualice la página. ¿No es molesto? ¿Hay alguna solución? ¡Sí! Sígueme. Solo utilizamos cookies para controlarlo.
Primero, agregue el siguiente código a
ltscriptgt
Función openwin(){
window.open("page. html " ," ancho=200, alto=200 "
}
Función get_cookie(Nombre){
var búsqueda = Nombre "= "
var valor de retorno =
if(documentos . cookie . longitud >0){
desplazamiento = documentos . índice de(búsqueda)
if (. offset!=-1){
Desplazamiento = longitud de búsqueda
fin = documentos . índice de (";", desplazamiento
if (. end ==-1)
end = documentos . cookie longitud
valor de retorno = unescape(documentos . cookie . substring(offset, end))
}
}
Devolver valor de retorno
}
Función loadpopup(){
if (get_cookie( 'apareció')=="{
openwin()
documents.cookie="apareció=yes "
}
}
lt/script gt;
Luego, use
En este punto, las habilidades de producción y aplicación de ventanas emergentes están básicamente completas. Puede ayudar. Los amigos que están trabajando en páginas web están muy contentos.
Cabe señalar que las mayúsculas en el script JS deben ser consistentes.
No hay ventanas emergentes. para menús, barras de herramientas y barras de direcciones:
ltscript language = "javascript" gt
lt -
var gt = unescape(' 3e ');
var popup = null
var over = "Iniciar navegador emergente";
popup = window.open(',' popupnav ',' width=500, altura=500, resizable= 0, barras de desplazamiento = auto '); // ancho=500, altura=500 es el largo y ancho de la ventana.
if (popup! = null) {
if (popup.opener == null) {
popup.opener = self}
Popup.location.href = 'Nombre del archivo a abrir';
}
//- gt;
lt/script gt;
} p>
Usar ventanas emergentes es muy sencillo. Haga clic en "Ventana emergente" en el menú de funciones y se mostrará "Editar contenido de la ventana emergente" en la página que se abre:
Simplemente ingrese el contenido del texto directamente en ella. Al escribir, puede usar la barra espaciadora, la tecla Intro, etc., ¡como si editara un documento en "Word"!
Luego, haga clic en "Opciones de función" en el menú de funciones y configure la ventana emergente en "Activado".
Cuando actualice la página de inicio del sitio web, aparecerá una ventana. El contenido interior es la información de texto que acaba de ingresar. ¿cómo son las cosas? ¡Simple!
Pero esta ventana emergente se ve fea. Algunos usuarios sugirieron cómo configurar el texto y el color de fondo en la ventana emergente. En realidad, es muy simple.
Primero, echemos un vistazo a las características de la ventana emergente:
En realidad es una página independiente con su propia dirección...
En su cuadro de edición, no habrá límite de palabras como "Texto de notificación de la página de inicio" y "Resumen del artículo"...
En el cuadro de edición, puede agregar cualquier código html...
Código fuente
Permítanos ingresar el código HTML para mostrarle cómo cambiar el color del texto y el fondo de la ventana:
La siguiente es una ventana emergente simple escrito en lenguaje HTML. La parte del carácter chino es el contenido que se muestra en la ventana emergente. Entre ellos, Color: los 6 dígitos después de # son los valores de color (también puede consultar el "Código de color" en "Materiales de la página web" en el manual de construcción del sitio web para modificarlo):
( 1) Escriba el código fuente.
lthtml gt
lthead gt
lttitle gt última notificación
ltmeta http-equiv = " Tipo de contenido " Contenido = " texto /html; charset=gb2312 "
ltstyle type="text/css " > lt! -
TB 1 {Color de fondo: #336633}
tb2 {Color de fondo: #339933}
. ;Color: #FFFFCC}
. fuente 2 {tamaño de fuente: 16px; Color: #FFFFff}
.
- gt;
lt/style gt;
lt/head gt
ltbody bgcolor = " # FFFFFF " margen izquierdo = " 0 " margen superior = " 0 " >>p>
ltspan class="font1 " > lt/spangt.
lttable width = " 283 " border = " 0 " cellpacing = " 0 " cell padding = " 10 " align = " center " height = " 340 " class = TB 1 gt
lttr gt
lttd gt
lttable width = " 100 " border = " 0 " espaciado de celda = " 0 " relleno de celda = " 1 " bgcolor = " # FFFFFF " gt ;
lttr gt
lttd gt
lttable width = " 100 " border = " 0 " espaciado de celdas = " 0 " relleno de celda = " 5 " altura = " 330 " clase = tb2 gt;
lttr align="center "
lttd class="font1 " > ltspan class=font1gt. Últimos desarrollos
ltHR size = " 1 " width = " 95 " color = # ffffcc gt.
lt/TD gt;
lt/tr gt
lttr gt
lttd valign="top"gt.
ltp gt ltspan class=font2gt. Recientemente, este sitio web ha abierto las columnas "Producto exclusivo" y "Mensaje al cliente", donde puede ver mucha de la información más reciente, ¡esperándolo! Al mismo tiempo, parte de la información más reciente del producto se colocará en la columna "Información más reciente". Este sitio web acaba de comenzar a construirse y aún no está maduro. ¡Espero que todos puedan darme opiniones valiosas! ¡También espero que todos me apoyen! lt/spangt. lt/p gt;
ltp gt ltspan class=font2gt. Si tienes amigos con ideas afines, ¡no dudes en contactarme! lt/spangt. lt/p gt;
lt/TD gt;
lt/tr gt
lttr align="derecho"
lttd gt ltspan class=font3gt. 【Red Tongchuang】