'Tutoriales' Categoría


TabStrip simple discreto

USimpleTabStrip discreto JavaScript es mejorar los vínculos de anclaje clásico (todavía) en una página HTML. Esta fuente es una mejora de la función presentada en el de Tabstrip discreto . En esta versión, así como alinear el código de la Versión 1.6 de prototype.js ha creado una clase real para gestionar el TabStrip. La liberación se presenta aquí es muy simple y directo. Su trabajo principal consiste en la adición de un evento de clic al enlace normal de anclaje. Estilos CSS tampoco se presentó, sólo para dejar la máxima libertad de acción, pero usted puede conseguir un TabStrip eficaz con unas pocas líneas adicionales de código CSS, consulte Adición de estilos CSS a continuación.

HTML

La clase USimpleTabStrip trabajando en un HTML simple, la sftuttando de anclaje ( <a name></a> ):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<-! Simple lista de enlaces de la página ->
< ul >
= "#tbs1" > Link 1 < / a >< / li > < a > < un href = "# tbs1"> Link 1 </ un > </ a >
= "#tbs2" > Link 2 < / a >< / li > < a > < un href = "# tbs2"> Link 2 </ un > </ a >
= "#tbs3" > Link 3 < / a >< / li > < a > < un href = "# tbs3"> Link 3 </ un > </ a >
</ ul >

<-! Bloques / pestañas ->

"tbs1" >< / a > < un name = "tbs1"> </ un >
< div >
h1 > < h1 > Listado # 1 </ h1 >
p > < p > Bla bla bla .... </ p >
</ div >

"tbs2" >< / a > < un name = "tbs2"> </ un >
< div >
h1 > < h1 > Lista # 2 </ h1 >
p > < p > Bla bla bla .... </ p >
</ div >

"tbs3" >< / a > < un name = "tbs3"> </ un >
< div >
h1 > < h1 > Data # 3 </ h1 >
p > < p > Bla bla bla .... </ p >
</ div >

funziona da contenitore. La etiqueta div justo por debajo del ancla a el trabajo como un contenedor.

Continuación ...

ActionScript 3.0 para principiantes: lección # 1

Premisa

ActionScript 3.0 puede ser un buen punto de partida para conocer, quienes no están familiarizados con la programación en C y / o C + +, orioentata de programación (OOP). Además, esta serie de lecciones será útil para los que vienen de otras habitaciones o de versiones anteriores de Flash.

Establecer un proyecto

En esta primera lección veremos cómo configurar un proyecto de Flash CS3 genéricos. Es bueno utilizar cuando los proyectos se espera que para hacer frente a por lo menos más de un archivo. El uso de este proyecto fue presentado - por Macromedia - ya en versiones anteriores a CS3, por lo que debe ser un tema conocido para los desarrolladores de ActionScript 2.0.
Sin embargo, con Actionscript 3.0 - como veremos - es posible crear una Actionscript (saws.) Para la película-documento raíz nuestra Fla por así decirlo.. Esta característica es muy útil y también hace un mínimo de proyectos de al menos dos archivos:. La Florida como asociados. Por esta razón, que "siempre" de un proyecto, por lo que ahora la organización de los diferentes archivos (. Fla,. As, ...) que formarán parte de nuestro "paquete" de desarrollo.
Además, una vez que aprenda el dimesticazza con la filosofía de los objetos, instrinseca en este tipo de lenguaje, acaban con muchos archivos será normal, incluso para proyectos sencillos sustancialmente.

Continuación ...

Uso de plantillas para crear un mapa del sitio WordPress

No es una característica de WordPress, a veces pasado por alto, lo cual lo hace muy versátil, especialmente para aquellos que crean temas: el uso de plantillas! Una plantilla no es sólo un archivo incluido en la carpeta del tema. Para identificar como una plantilla sólo tiene que insertar un comentario especial al principio del archivo en PHP:

1
2
3
/ *
Nombre de la plantilla: Mapa del sitio
* /

Al utilizar esta función, puede crear una página en blanco, con el procedimiento estándar de WordPress, y conectarlo a nuestra plantilla. Si crea un archivo, por ejemplo sitemap.php (agregando el comentario se muestra arriba) y se cargan en la carpeta de tu tema, te darás cuenta de que el editor durante la creación de una página de WordPress (no es un post) del menú Plantilla (abajo) contiene el nombre del archivo de plantilla se ha cargado. Como se indica en la sección de plantillas:

Algunos temas tienen plantillas que puede utilizar para ciertas páginas que pueden contener características adicionales o gráficos personalizados. [...]

Yo, por ejemplo, he usado esta característica para crear una página dinámica (que luego se ejecuta el código PHP) pueden mostrar un verdadero mapa de tu blog.

Creación de un Sitemap página

En primer lugar se crea un archivo sitemap.php y cargar la carpeta de tu tema. WordPress mediante la creación de una nueva página, darle un nombre y seleccione la plantilla en el menú que se encuentra por debajo del editor! ¡Ya está!

La plantilla, como parte del tema, sino que también contiene toda la estructura del tema en sí es importante conocer y escribir correctamente. Pero aquí hay un esqueleto de un sitio que se pueden modificar para reflejar el tema se ha instalado:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<Php
/ *
Nombre de la plantilla: Mapa del sitio
* /
>
<? Php get_header ();?>
"content" > < div id = "contenido">
have_posts ( ) ) : the_post ( ) ; ?> ? <Php if (have_posts ()): while (have_posts ()): the_post ();?>
"post" id = "post-<?php the_ID(); ?> "> < div class = "post" id = "post-<? php the_ID ();?>">
h2 > < h2 > <? php the_title ();?> </ h2 >
"date-time" ><?php the_time ( 'lj F, Y' ) ?>< / small > < pequeña class = "fecha y hora"> <? php the_time ('lj F, Y')?> </ pequeño >
"entry" > < div class = "entrada">
href = "<?php bloginfo('url'); ?> " alt=" <?php bloginfo ( 'name' ) ; ?> ">Home < / a >< / strong >< / p > < p > < fuerte > < un href = "<? php bloginfo ('url');?>" alt =" <? bloginfo php (' nombre');?>"> Inicio </ un > </ p > </ p >
h3 > < h3 > Página </ h3 >
< ul >
; ?> <? Php wp_list_pages ('title_li =');?>
</ ul >
h3 > < h3 > entrada </ h3 >
< ul >
) ; <Php $ archive_query = new WP_Query ('showposts = 1000');
while ($ archive_query-> have_posts ()): $ archive_query-> the_post ();?>
= "<?php the_permalink() ?> " rel="bookmark" title="Permanent Link to <?php the_title ( ) ; ?> "> <?php the_title ( ) ; ?>< / a >< / li > < a > < un href = "<? php the_permalink ()?>" rel =" bookmark "title =" Enlace Permanente <? php the_title ();?>"> <? php the_title ();?> </ uno > </ a >
<? Php endwhile;?>
</ ul >
h3 > < h3 > Archivos mensuales </ h3 >
< ul >
; ?> <? Php wp_get_archives ('type =');?> mensuales
</ ul >
h3 > < h3 > Categoría </ h3 >
< ul >
; ?> <? Php wp_list_categories ('title_li = 0');?>
</ ul >
h3 > < h3 > RSS / FeedBurner </ h3 >
< ul >
= "<?php bloginfo('rdf_url'); ?> " alt="RDF/RSS 1.0 feed"> < acronym title = "Resource Description Framework" > RDF < / acronym > / < acronym title = "Really Simple Syndication" > RSS < / acronym > 1.0 feed < / a >< / li > < a > < un href = "<? bloginfo php ('rdf_url');?>" alt =" RDF / RSS 1.0 feed "> < siglas título = "Resource Description Framework"> RDF </ siglas > / < siglas título = "Really Simple Syndication"> RSS </ siglas > 1.0 canales </ un > </ a >
= "<?php bloginfo('rss_url'); ?> " alt="RSS 0.92 feed"> < acronym title = "Really Simple Syndication" > RSS < / acronym > 0.92 feed < / a >< / li > < a > < un href = "<? php bloginfo ('rss_url');?>" alt =" RSS feed 0,92 "> < siglas título = "Really Simple Syndication"> RSS </ siglas > 0,92 feed </ un > </ a >
= "<?php bloginfo('rss2_url'); ?> " alt="RSS 2.0 feed"> < acronym title = "Really Simple Syndication" > RSS < / acronym > 2.0 feed < / a >< / li > < a > < un href = "<? bloginfo php ('rss2_url');?>" alt =" RSS 2.0 feed "> < siglas título = "Really Simple Syndication"> RSS </ siglas > 2,0 alimenta </ un > </ a >
= "<?php bloginfo('atom_url'); ?> " alt="Atom feed">Atom feed < / a >< / li > < a > < un href = "<? bloginfo php ('atom_url');?>" alt =" Atom feed "> Atom </ un > </ a >
</ ul >
</ div >
</ div >
<? Php endwhile, endif;?>
</ div >
? <Php get_sidebar (); get_footer ();?>

Continuación ...

Tutorial de Photoshop: Técnicas de reflexión

A partir de las imágenes de Apple Web 2.0 "refleja" inundado Intrenet. Se abusa a menudo, sin embargo, son siempre impresionantes. Sabe cómo hacer un buen negocio no es complicado y, con un Pizzoc de la imaginación, puede hacer que sea menos "evidentes" y "descuento" ... si usted no puede prescindir.

Los fundamentos de la SLR

En primer lugar vamos a ver cómo configurar una reflexión básica. La base técnica para el establecimiento de un reflejo, al menos mi favorito y yo uso todo el tiempo, es la aplicación simple y rápida. Este método permite la máxima libertad para hacer cambios más adelante, y mantiene la transparencia en el caso de que desee guardar la imagen en PNG 24 con la transparencia.

Cargando flash ...

1. Phosotoshop Como siempre, abrir y cargar la imagen que queremos reflejar en una capa específica
2. Duplicar nuestra capa (arrastrar el icono de la capa de duplicar imagen ) Y nominiamolo "sombra" o "reflejo"
3. Desde el menú "Editar" seleccione "Transformar" / "Voltear vertical"
4. Arrastre la nueva capa "reflejo" de debajo de la capa original y la base de la capa original spostiamolo
5. Seleccionamos la capa "reflejo" y manteniendo presionada la tecla ALT, añadir una máscara haciendo clic en el icono imagen "Las máscaras" en la capa de ventana de la herramienta, la capa "reflejo" debe desaparecer
6. Seleccionamos la máscara en la capa "reflejo" y haga clic en imagen Relleno
7. Hemos creado un degradado de negro o de blanco a transparente: imagen
8. Dibuja el gradiente desde el centro de la capa original en la capa media del "reflejo"

Continuación ...

Flash Técnicas de texto de reemplazo

La técnica de reemplazo de texto que hoy presento es en algunos aspectos, muy interesante. A diferencia de la clásica imagen usando CSS para reemplazar a la operación , esta técnica utiliza una película de Flash para sobrescribir los títulos de nuestro sitio. A pesar de ser un poco más complejo, que requiere la creación de una película Flash y el uso de JavaScript, produce una serie de ventajas considerables:

  • Mantiene el acceso a la página mediante un Verdadero discreto Javascript para que los rastreadores, arañas seguir viendo la página como HTML simple y correcta
  • No requiere la creación de n por n títulos de imagen. Sólo una película para reemplazar todos los títulos de nuestro sitio, con un ahorro considerable en términos de la descarga
  • También le permite crear títulos simples pero no las fuentes normalmente se utilizan en la Web
  • Texto se puede representar en HTML, gracias a las características de Flash
  • El texto se puede seleccionar
  • Como se puede insertar una película Flash y animaciones interactivas de cualquier tipo

Se le nota, además, que en este procedimiento son prácticamente CSS en cuenta!

Continuación ...

Técnicas de texto de reemplazo de HTML / CSS

La forma correcta de insertar un título en los gráficos en una página Web es para reemplazar a la operación con las hojas de estilo (ver la mejora progresiva en Accesibilidad y Usabilidad: discreto JavaScript ). Esta técnica le permite hacer más accesible el contenido del sitio, independientemente de la pantalla de los juegos gráficos de hojas de estilo. Además, los robots, arañas, tienen una lectura correcta de HTML, haciendo caso omiso de los gráficos de reemplazo ofrecer al usuario final. Insertar una imagen directamente (TAG img ), de hecho, que el texto del título inaccesible para los lectores ordinarios ASCII (rastreadores, arañas, plugins blog, los lectores de pantalla, etc ...).

Continuación ...

OnAir: Elige el video con el nuevo on-demand

En OnAir de Undolog ahora es posible utilizar en la demanda hecha por el jugador disposizine Mogulus .

Informe de video

Si usted tiene la señal de vídeo en contacto , voy a ser feliz - si es posible - incluir en el calendario de Undolog / OnAir

Continuación ...

PicLens 2.0 en Flash con Papervision3D: Parte II

En esta ocasión (ver PicLens en Flash con Papervision3D 2.0 ) clave pública ( PicLens.as ), tuve que revisar algunas partes del código, se alinean con la última versión de Papervision3D 2.0 Great White y he hecho algunos ajustes y adiciones.

Continuación ...

Crear un preloader en ActionScript 3.0 Generic

Puede parecer una predecible y ya agotado, pero con Flash CS3 y la nueva dirección de las clases de documento (paquete) permitido en ActionScript 3.0, no es completamente funcional de inmediato crear un preloader. La última versión de Flash, de hecho, se las arregla para cargar la película de una manera diferente de las anteriores versiones. En la red se pueden encontrar diferentes propuestas y soluciones para crear un preloader "vieja escuela". Sin embargo, varios ejemplos que encontré no me satisface totalmente, ya que requieren de modificar la película para que funcione como un preloaders clásico. En la práctica, cuando se desarrolla siempre debe recordar "esta cosa que tengo que hacerlo de otra manera la precarga no funciona!" Y para las películas ya está lleno, entonces?

Cargador

La solución que han adoptado, al menos por ahora, era hacer una película fuera (mi cargador - ver ejemplo ) capaz de cargar cualquier fuera de la película, incluyendo una foto! Esta solución, aunque requiere, básicamente, dos películas (el cargador y el FILAME cierto), se convierte en rentable sólo si se puede crear un cargador que puede ser utilizado una y otra vez, que es capaz de cargar cualquier película, cualquier resolución y cualquier tarifa del marco.

Continuación ...

Reflex y ReflexMe: de la clase base a la clase

En el puesto de Flash CS3: Crear un efecto de reflejo en cualquier MovieClip hemos visto cómo se puede escribir una clase que amplíe MovieClip, para conectarlo a designtime a cualquier MovieClip en la biblioteca. Descubrí, sin embargo, que puede ser la ruta más útil y económico para el contrario. He creado una clase Reflex ( Reflex.as ), con la intención de usarlo exclusivamente por el código. He creado esta forma de pensar de la clase al mover el puntero en el constructor de un clip de película. , ma leggermente modificato in modo da poter funzionare espressamente da codice: La nueva clase de Reflex contiene esencialmente el mismo código insertado en la primera ReflexMe , pero ligeramente modificada con el fin de trabajar específicamente por el código:

1
2
3
4
/ /
sfx .*; importaciones undolibrary * sfx..;
/ /
Reflex = new Reflex ( movieClipInstance ) ; var rx: = new Reflex Reflex (movieClipInstance);

Continuación ...



Dejar de SOPA