#contenedor general{
width: 100%;
height: 100%;
}
#fondo swf{
position:fixed; top: 0px; left: 0px;
height:100%;
width: 100%;
z-index: 1;
}
#contenedor html{
position: relative; top: 50px;
margin-left: auto; margin-right: auto;
z-index: 2;
width: 500px;
}
#titulo html{
position: relative; top: 50px;
margin-left: auto; margin-right: auto;
z-index: 2;
width: 500px;
text-align: center;
}
Ciao
Estoy haciendo una grafica en la cual el background és un swf que ocupa todo el navegador y encima va el texto html del contenido.
El fondo en swf lo he conseguido y el html por encima en Google Chrome va bien, pero en Firefox e Iexplorer todo el html se pone debajo del video, adjunto el css por si le veis algun defecto o solucion:
Código:#contenedor general{ width: 100%; height: 100%; } #fondo swf{ position:fixed; top: 0px; left: 0px; height:100%; width: 100%; z-index: 1; } #contenedor html{ position: relative; top: 50px; margin-left: auto; margin-right: auto; z-index: 2; width: 500px; } #titulo html{ position: relative; top: 50px; margin-left: auto; margin-right: auto; z-index: 2; width: 500px; text-align: center; }
<script src="js/jquery-1.6.1.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet" charset="utf-8" />
<link type="text/css" href="css/style.css" rel="stylesheet" media="screen" />
<script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>
<ul class="gallery clearfix">
<li><a href="http://www.youtube.com/watch?v=rbdjyqNE9SA?rel=0" title="YouTube demo Prointek" rel= "prettyPhoto"><img src="image/temp3.jpg" alt="Youtube"/></a></li>
<script charset="utf-8" type="text/javascript">
$(document).ready(function(){
$("area[rel^='prettyPhoto']").prettyPhoto();
$(".gallery:first a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'normal',theme:'light_square',slideshow:3000, autoplay_slideshow: true});
$(".gallery:gt(0) a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'fast',slideshow:10000, hideflash: true});
$("#custom_content a[rel^='prettyPhoto']:first").prettyPhoto({
custom_markup: '<div id="map_canvas" style="width:260px; height:265px"></div>',
changepicturecallback: function(){ initialize(); }
});
$("#custom_content a[rel^='prettyPhoto']:last").prettyPhoto({
custom_markup: '<div id="bsap_1259344" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div><div id="bsap_1237859" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6" style="height:260px"></div><div id="bsap_1251710" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div>',
changepicturecallback: function(){ _bsap.exec(); }
});
});
</script>
<script charset="utf-8" type="text/javascript">
$(document).ready(function(){
$("area[rel^='prettyPhoto']").prettyPhoto();
$(".gallery: a").prettyPhoto({animation_speed:'normal',theme:'light_square',slideshow:3000, autoplay_slideshow: true});
$("#custom_content a[rel^='prettyPhoto']:first").prettyPhoto({
custom_markup: '<div id="map_canvas" style="width:260px; height:265px"></div>',
changepicturecallback: function(){ initialize(); }
});
$("#custom_content a[rel^='prettyPhoto']:last").prettyPhoto({
custom_markup: '<div id="bsap_1259344" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div><div id="bsap_1237859" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6" style="height:260px"></div><div id="bsap_1251710" class="bsarocks bsap_d49a0984d0f377271ccbf01a33f2b6d6"></div>',
changepicturecallback: function(){ _bsap.exec(); }
});
});
</script>
Al ajaxToolkit:ComboBox le modifican la propiedad CssClass y le ponen el nombre de la clase CSS que modifica el estilo del control, te tienes que asegurar de que tu pagina aspx este haciendo referencia a esa clase CSS en particular, ahi mismo en la pagina que pusiste explican detalladamente lo que te digo en la parte que dice " ComboBox Theming" pero si te quieres sacar el estilo de algo que ves en alguna pagina te recomiendo que uses el firebug de firefox y así vas sacando las clases de cualquier pagina para que las pegues en tu propio archivo de estilos.
Por ejemplo lo que tendrias que poner en tu hoja de estilos para que se vea azul es
.AquaStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input {
background-image: url("ComboBox/images/aqua-bg.gif");
background-position: left top;
border: 0 none;
font-size: 11px;
height: 17px;
margin: 0;
padding: 2px 0 0 8px;
width: 150px;
}
.AquaStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button {
background-image: url("ComboBox/images/aqua-arrow.gif");
background-position: left top;
border: 0 none;
height: 19px;
width: 19px;
}
.AquaStyle .ajax__combobox_itemlist {
background-color: #FFFFFF;
border-color: #000000;
}
y hacer referencia a la clase AquaSyle en el control ajaxToolkit CssClass="AquaStyle" y también sacar las 2 imágenes que contiene la clase.
Como así? lo que quieres es que un texto especifico se vea en color azul y con subrayado al pasar el cursor? o modificar una clase que ya tienes para agregarle este efecto?
"Pregunta Tecnica Maicol Giovany"...
Yo puedo hacer que todo el texto de una determinada clase sea un link a alguna URL?
No, la pregunta no es sobre lograr el efecto, sino saber si puedo hacer que redireccione a una url...
Es que estoy usando un Jquery que muetra un cartelito en una esquina de la pagina, pero necesito hacer que al clickear en el cartel me redirija a otra parte.
Entonces como no pude hacerlo por html, pensé en alguna forma de usar CSS para que al hacer click en el texto del cartelito o en cualquier parte del div me redijera a donde quiero,
si se puede hacer esto con CSS? ...ahora que lo pienso... existe la posibilidad de crearle una capa transparente encima del div? y que ésta sea la que contenga el enlace?... o un .PNG transparente... No se cual serà la forma correcta de hacerlo, o como lo harian uds?
.enlacefijo {
position: absolute;
top: 0;
right: 0;
z-index: 9999;
width: 200px;
height: 200px;
display: block;
}