Creo que la mayoría de ustedes saben cómo usar páginas web para emerger ventanas en varias formas, pero hoy aprendamos cómo crear una variedad de ventanas emergentes:
1. Abra una ventana de pantalla completa
El código es el siguiente:
<html> <body //www.vevb.com ',' wulin.com ',' fullscreen '); ">; <b> www.vevb.com </b> </body> </html>
2. Abra una ventana que ha sido transformada por F11
El código es el siguiente:
<html> <body '//www.vevb.com', 'wulin.com', 'canalMode'); ">; <b> www.vevb.com </b> </body> </html>
3. Abra una ventana con la barra de herramientas de enlace favorita
El código es el siguiente:
<html> <body www.wangye8.com ',' wulin.com ',' width = 400, altura = 300, directorios '); "> <b> www.wangye8.com </b> </body> </html>
4. Cuadro de diálogo de la página web
El código es el siguiente:
<html> <script language = "javascript"> <!-showModalDialog ('// www.vevb.com,' wulin.com ',' dialogwidth: 400px; dialogHeight: 300px; dialogleft: 200px; dialogTop: 150px; Center: sí; helh: sí; resizable: sí; sí: sí ') <b> www.wangye8.com </b> </body> </html> <html> <script language = "javaScript"> <!-! showModeScelessDialog ('// www.vevb.com,' wulin.com ',' dialogwidth: 400px; dialogHeight: 300px; dialogleft: 200px; dialogTop: 150px; Center: sí; ayuda: sí; resizable: yes; status: sí ') //-</script> <b> http:///// /wwwwwwwwwwwwwwwwwwwwwww. </body> </html>showModalDialog () o showModelessDialog () para llamar al cuadro de diálogo web. En cuanto a la diferencia entre showModalDialog () y showModeScelessDialog (), es que la ventana abierta por showModalDialog () (denominada ventana de modo) se coloca en la ventana principal y debe estar cerrada para acceder a la ventana principal (se recomienda usarlo lo menos que sea posible para evitar desagradable); showModelessDialog ()
DialogHeight: Iheight establece la altura de la ventana de diálogo.
Dialogwidth: iWidth establece el ancho de la ventana de diálogo.
dialogleft: ixpos establece la posición izquierda de la ventana de diálogo relativa a la esquina superior izquierda del escritorio.
Dialogtop: IYPOS establece la posición superior de la ventana de diálogo relativa a la esquina superior izquierda del escritorio.
Centro: {SÍ | No | 1 | 0} Especifica si se debe centrar el cuadro de diálogo en el escritorio, el valor predeterminado es "Sí".
Ayuda: {SÍ | No | 1 | 0} Especifica si el icono de ayuda sensible al contexto se muestra en la ventana de diálogo. El valor predeterminado es "Sí".
RESIZABLE: {SÍ | No | 1 | 0} Especifica si el tamaño de la ventana de diálogo es variable. El valor predeterminado es "no".
Estado: {SÍ | No | 1 | 0} Especifica si la barra de estado se muestra en la ventana de diálogo. Para Windows de diálogo sin modo, el valor predeterminado es "Sí"; Para Windows de diálogo de modo, el valor predeterminado es "no".
5. Otros códigos de ventana emergente
Los amigos que a menudo navegan por Internet pueden haber visitado tales sitios web. Una vez que ingresen a la página de inicio, aparecerá una ventana inmediatamente o presionará un enlace o botón para que aparezca. Por lo general, algunas precauciones, información de derechos de autor, advertencias, bienvenidas, etc., o información que el autor desea dar indicaciones especiales. De hecho, es muy fácil hacer una página de este tipo. Simplemente agregue algunos códigos de script Java al HTML de la página. A continuación, te llevaré a analizar su misterio.
【El código de ventana emergente más básico】
De hecho, el código es muy simple:
El código es el siguiente:
<Script language = "java script"> <!-window.open ('page.html')-> </script>Debido a que este es una pieza del código de script Java, deben colocarse entre <script language = "java script"> etiqueta y </script>. <!-y-> son útiles para algunos navegadores con versiones más bajas. Si el script Java no es compatible con estos navegadores antiguos, el código en la etiqueta no se mostrará como texto.
Window.open ('Page.html') se usa para controlar la ventana emergente de una nueva ventana. Si Page.html no está en la misma ruta que la ventana principal, la ruta debe escribirse en el frente, tanto la ruta absoluta (http: //) como la ruta relativa (../) están bien.
Está bien usar citas simples y dobles, pero no las mezcle.
Esta pieza de código se puede agregar a cualquier ubicación de HTML, y se puede agregar entre <Able> y </Elovio>. Cuanto mayor sea la posición, más temprana es la ejecución, especialmente cuando el código de página es más largo, intente presentarla si desea que la página aparezca temprano.
【Ventana emergente después de configurar】
Hablemos sobre la configuración de la aparición de la ventana emergente. Simplemente agregue un poco más al código anterior.
Personalemos la apariencia, el tamaño y la posición emergente de esta ventana emergente para adaptarse a la situación específica de la página.
El código es el siguiente:
<Script language = "java script:> <!-window.open ('page.html', 'newWindow', 'Height = 100, width = 400, top = 0, izquierda = 0, barra de herramientas = no, menuBar = no, scrollbars = no, reenizable = no, ubicación = no, status = no') // escribe una línea-> </script>Explicación del parámetro:
<Script language = "Java script"> El script js comienza;
Ventana. Comando abre para aparecer una nueva ventana;
Page.html El nombre del archivo de la nueva ventana aparece;
El nombre de la ventana emergente de NewWindow (no el nombre del archivo), que puede ser reemplazado por vacío ";
altura = 100 altura de la ventana;
superior = 0 el valor de píxel de la ventana desde la parte superior de la pantalla;
izquierda = 0 el valor de píxel de la ventana desde el lado izquierdo de la pantalla;
Barra de herramientas = No para mostrar la barra de herramientas, sí es la pantalla;
Menubar, barras de desplazamiento significa barra de menú y barra de desplazamiento;
RESIZABLE = No para permitir cambiar el tamaño de la ventana, sí está permitido;
Ubicación = No para mostrar la barra de direcciones, sí está permitido;
Estado = No para mostrar información en la barra de estado (generalmente el archivo ya está abierto), sí está permitido;
</script> El script js termina.
【Use funciones para controlar ventanas emergentes】
Aquí hay un código completo.
El código es el siguiente:
<html> <fead> <script language = "java script"> <!-function openwin () {window.open ("page.html", "newWindow", "Height = 100, width = 400, herramienta = no, menuBar = no, scrollbars = no, reizable = no, ubicación = no, estatus = no";) > ... Contenido de página arbitraria ... </body> </html>Aquí hay una función OpenWin () definida, y el contenido de la función es abrir una ventana. No hay uso hasta que se llame. ¿Cómo llamarlo?
Método 1: <Body> Aparece una ventana emergente cuando el navegador lee la página;
Método 2: <Body> Una ventana emergente aparece cuando el navegador sale de la página;
Método 3: Llame con una conexión: <a href = "#"> Abra una ventana </a>
Nota: El "#" utilizado es una conexión virtual.
Método 4: Llame con un botón: <input type = "button" value = "Open Window">
[El archivo 1.htm se abre en la ventana principal, y una pequeña ventana de la ventana.html aparece al mismo tiempo]
Agregue el siguiente código al área de la ventana principal <Head>:
El código es el siguiente:
<script language = "java script"> <!-function openwin () {window.open ("page.html", "", "width = 200, Height = 200";)} //-> </script>Simplemente agregue el área <body>: <a href = "1.htm"> abrir </a>.
【Control Control de cierre cronometrado para ventana emergente】
Tomemos un poco de control sobre la ventana emergente, y el efecto será aún mejor. Si agregamos una pequeña pieza de código a la página emergente (tenga en cuenta que se agrega al HTML de Page.html, no a la página principal, de lo contrario ...), ¿no sería más genial dejarlo cerrar automáticamente después de 10 segundos?
Primero, agregue el siguiente código al área <Head> del archivo page.html:
El código es el siguiente:
<script language = "java script"> function ssock () {setTimeout ("self.close ()", 10000) // ms} </script>Luego, use la oración <Body> en lugar de la oración original <Body> en Page.html. (¡No olvides escribir esta oración! El propósito de esta oración es llamar al código que cierra la ventana y cerrar la ventana tú mismo después de 10 segundos).
【Agregue un botón de cierre en la ventana emergente】
El código es el siguiente:
<form>
<Input type = 'button' value = 'Close'
</form>
¡Jaja, es más perfecto ahora!
[Ventana Popt -Up incluida - Dos ventanas por página]
Los ejemplos anteriores contienen dos ventanas, una es la ventana principal y la otra es la ventana emergente.
Con el siguiente ejemplo, puede completar el efecto anterior en una página.
El código es el siguiente:
<html> <fead> <script language = "java script"> function openwin () {openWindow = window.open ("", "newwin", "Height = 250, width = 250, Barra de herramientas = no, scrollbars ="+scroll+", menuBar = no";); // escríbalo como una línea OpenWindow.document.Write ("<title> Ejemplo </title>";) OpenWindow.Document.Write ("<Body bgcolor =#fffff>";) openwindow.document.write ("<h1> hola! </h1>";) openwindow.document.write ("New Window Opened!"; ";") ";"; ")"; ") OpenWindow.Document.Write ("</body>";) OpenWindow.document.write ("</html>";) openWindow.document.close ()} </script> </toad> <body> <a href = "#"> Open una ventana </a> <input type = "Botón" Valor = "Open Window"> </body> </html>Veamos si el código en OpenWindow.document.write () no es el HTML estándar. Simplemente escriba más líneas en el formato. Tenga cuidado de que una etiqueta más o una etiqueta menos cause errores. Recuerde terminar con OpenWindow.document.close ().
【Aplicación final: control de cookies en la ventana emergente】
Recuerde que aunque la ventana emergente anterior es genial, hay un pequeño problema (está inmerso de alegría, no debe encontrarla, ¿verdad?) Por ejemplo, si coloca el script anterior en una página que necesita pasar con frecuencia (como la página de inicio), cada vez que actualiza esta página, la ventana aparecerá una vez. ¿No es muy molesto? ¿Hay una solución? ¡Sí! Sígueme. Solo necesitamos usar cookies para controlarlo.
Primero, agregue el siguiente código al área <Head> de la página principal HTML:
El código es el siguiente:
<script> function openPopup () {window.open ("hello.htm", "", "width = 300, altura = 300") // Modifique la ventana emergente usted mismo} function get_cookie (name) {var search = name + "=" var returnvalue = ""; if (documents.cookie.length> 0) {offset = documents.cookie.indexof (search) if (offset! = -1) {// si la cookie existe offset += search.length // establecer índice de inicio de valor end = documents.cookie.indexof (";", offset); // establecer el índice del final del valor de la cookie if (end == -1) end = documents.cookie.length; returnValue = unescape (documents.cookie.substring (offset, end))}} return returnValue; } function loadPopup () {if (get_cookie ('popped') == '') {openPopup () documents.cookie = "Popped = Yes"}} </script>Escriba el siguiente código en el área del cuerpo:
<Body> // Pop cuando salga de la página
o:
<Body> // Pop cuando ingrese a la página
Puede intentar actualizar esta página o volver a entrar, y la ventana nunca volverá a aparecer. ¡El verdadero pop-solo de super!
Habiendo escrito esto, las técnicas de producción y aplicación de las ventanas emergentes se han terminado básicamente. Espero estar muy contento de ayudar a mis amigos que están haciendo páginas web.
Cabe señalar que el caso en los scripts JS se mantiene mejor consistente antes y después.
Ventanas emergentes sin menús, barras de herramientas y barras de dirección:
El código es el siguiente:
<script language = "java script"> <!- var gt = unescape ('%3e'); var PopUp = null; var over = "Lanzar navegador emergente"; popup = window.open ('', 'popupnav', 'width = 500, altura = 500, resizable = 0, scrollbars = auto'); // ancho = 500, la altura = 500 son la longitud de la ventana y el ancho if (popup! = null) {if (popup.opener == null) {popup.opener = self; } popup.location.href = 'El nombre del archivo a abrir'; } // -> </script>Método 2: Aplicación de cookies: Ventana emergente de control Cuando establezcamos una ventana emergente en una página, cada vez que volvemos a ser la página, la ventana POP aparecerá automáticamente, causando problemas innecesarios. Entonces, ¿cómo resolver este problema? Aquí usaré un ejemplo simple para explicar cómo hacer que la ventana emergente solo aparezca al navegar por la página por primera vez operando cookies, ¡y ya no causará molesto en el futuro!
Copie el código de la siguiente manera: <script> function OpenPopWindow () {Window.open ("Hello.htm", "", "Width = 200, Height = 200" // Modifique la ventana emergente usted mismo} function get_cookie (name) {var search = name + "="; var returnValue = ""; if (document.cookie.length> 0) {offset = = Document.cookie.indexof (búsqueda); returnValue = unescape (documents.cookie.substring (offset, end))}} return Valor;
Escriba el código anterior en el área del cuerpo: <Body> // Popt al salir de la página
O: <Body> // El efecto de la ventana emergente aparece cuando aparece la página al salir de la página:
Efecto: Cuando otros cierran esta página, aparece una ventana y puedes escribir algunas palabras de bendición
Código central:
El código es el siguiente:
<script language = "javaScript"> <!-beginfing leave () {window.open ('1.htm', ", 'Barra de herramientas = no, menuBar = no, ubicación = no, altura = 225, width = 235'); break} // end-> </script>Lo anterior es todo el contenido de este artículo. Espero que sea útil para el aprendizaje de todos y espero que todos apoyen más a Wulin.com.