E' quello che ho provato a fare anche io ma non riesco lo stesso a far applicare le regole CSS...
Se non ti è troppo disturbo puoi aiutarmi direttamente con il codice?
Questa è la pagina in cui devo inserire l'oggetto in questione:
Codice PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Documento senza titolo</title>
<style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* è buona norma impostare a zero i valori margin e padding dell'elemento body per tenere conto delle diverse impostazioni predefinite dei browser*/
padding: 0;
text-align: center; /* centra il contenitore nei browser IE 5*. Il testo viene quindi impostato con l'allineamento predefinito a sinistra nel selettore #container */
color: #000000;
}
.oneColFixCtr #container {
width: 720px; /* utilizzando 20 px in meno rispetto alla dimensione piena di 800 px lascia spazio per gli elementi grafici e strutturali del browser ed evita che venga visualizzata una barra di scorrimento orizzontale */
background: #FFFFFF;
margin: 0 auto;
text-align: left;
margin-top: 100px;
height: 450px;
background-image: url(images/background.png);
}
.oneColFixCtr #mainContent {
padding: 0 20px; /* ricordare che i valori padding e margin corrispondono rispettivamente allo spazio interno ed esterno al riquadro div */
float: left;
width: 280px;
height: 280px;
margin-top: 40px;
margin-right: 0px;
margin-left: 78px;
}
.oneColFixCtr #container #link {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 10px;
color: #AE7401;
margin-top: 1px;
margin-right: 0px;
margin-left: 98px;
}
-->
</style>
<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style2 {color: #999999}
.style4 {color: #5E4424}
-->
</style>
</head>
<body class="oneColFixCtr">
<div id="container">
<div id="mainContent">
<h1>
<link rel="stylesheet" href="css/page.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/slider.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.2.js"></script>
<script src="js/jquery.anythingslider.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
function formatText(index, panel) {
return index + "";
}
$(function () {
$('.anythingSlider').anythingSlider({
easing: "easeInOutExpo", // Anything other than "linear" or "swing" requires the easing plugin
autoPlay: true, // This turns off the entire FUNCTIONALY, not just if it starts running or not.
delay: 3000, // How long between slide transitions in AutoPlay mode
startStopped: false, // If autoPlay is on, this can force it to start stopped
animationTime: 600, // How long the slide transition takes
hashTags: true, // Should links change the hashtag in the URL?
buildNavigation: true, // If true, builds and list of anchor links to link to each slide
pauseOnHover: true, // If true, and autoPlay is enabled, the show will pause on hover
startText: "Go", // Start text
stopText: "Stop", // Stop text
navigationFormatter: formatText // Details at the top of the file on this use (advanced use)
});
$("#slide-jump").click(function(){
$('.anythingSlider').anythingSlider(6);
});
});
</script>
</head>
<body>
<div class="anythingSlider">
<div class="wrapper">
<ul>[*]
[img]images/lmn001disegni031.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/disegni_02.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/lmn001disegni031.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_02.png[/img][*]
[img]images/lmn001disegni031.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/disegni_02.png[/img]
[/list]
</div>
</h1>
</div>
<div class="header" id="titolo">[img]images/monica-cecchi.png[/img]</div>
<style type="text/css">
#info {height:110px;}
.menu {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
width:110px;
position:relative;
font-size:11px;
float: right;
height: 20px;
margin-left: 50px;
margin-right: 45px;
margin-top: 120px;
}
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; width:110px; height:25px; text-align:left; color:#AE7401; padding-left:10px; border:1px solid #fff; border-width:0 1px 1px 0; line-height:25px; font-size:11px;}
.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {float:left; position:relative;}
.menu ul li ul {visibility:hidden; position:absolute;}
.menu table {border-collapse:collapse; margin:0; padding:0; font-size:1em; margin:-1px;}
.menu ul li:hover a, .menu ul li a:hover {color:#000;}
.menu ul li:hover ul, .menu ul li a:hover ul {visibility:visible; bottom:26px; left:0;}
.menu ul li:hover ul li a.sub, .menu ul li a:hover ul li a.sub {background:#FFFFF; color:#000;}
.menu ul li:hover ul li, .menu ul li a:hover ul li {display:block; background:#fff; color:#000;width:110px; clear:both;}
.menu ul li:hover ul li:hover a.sub, .menu ul li a:hover ul li a:hover.sub {background:#FFFFFF; color:#000;}
.menu ul li:hover ul li ul, .menu ul li a:hover ul li a ul {visibility:hidden; position:absolute;}
.menu ul li:hover ul li a, .menu ul li a:hover ul li a {display:block; background:#FFFFFF; color:#000; width:100%; padding-left:10px;}
.menu ul li:hover ul li a:hover, .menu ul li a:hover ul li a:hover {background:#FF9900; color:#000;}
.menu ul li:hover ul li:hover ul, .menu ul li a:hover ul li a:hover ul {visibility:visible; left:100px; bottom:0;}
.menu ul li:hover ul li:hover ul li a, .menu ul li a:hover ul li a:hover ul li a {background:#FFFFF; color:#000;}
.menu ul li:hover ul li:hover ul li a:hover, .menu ul li a:hover ul li a:hover ul li a:hover {background:#FF9900; color:#000;}
.menu ul li:hover ul.left, .menu ul li a:hover ul.left {left:-20px;;}
.menu ul li:hover ul li:hover ul.left, .menu ul li a:hover ul li a:hover ul.left {left:-120px; width:110px;}
</style>
</p>
</p>
</p>
</p>
</p>
<div class="menu">
<ul>[*][url="../opacity/index.html"]Opere[/url]
<ul class="left">
[*][url="../opacity/colours.html"]Gioielli[/url][*][url="../opacity/picturemenu.html"]Sculture[/url][*][url="../opacity/png.html"]Scatole[/url][*][url="../opacity/png2.html"]Disegni[/url][/list]
[/list]
</div>
<div class="header2" id="header">
<div align="right">[img]images/header-candele.png[/img]</div>
</div>
<div class="header3" id="link">Home <span class="style2"><span class="style4"></span></span>Profilo <span class="style2"><span class="style4"></span></span>Mostre <span class="style2"><span class="style4"></span></span>Critiche</div>
</div>
</body>
</html>
E questo e il codice da inserire, con il collegamento al foglio di stile associato:
Codice PHP:
<link rel="stylesheet" href="css/page.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/slider.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.2.js"></script>
<script src="js/jquery.anythingslider.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
function formatText(index, panel) {
return index + "";
}
$(function () {
$('.anythingSlider').anythingSlider({
easing: "easeInOutExpo", // Anything other than "linear" or "swing" requires the easing plugin
autoPlay: true, // This turns off the entire FUNCTIONALY, not just if it starts running or not.
delay: 3000, // How long between slide transitions in AutoPlay mode
startStopped: false, // If autoPlay is on, this can force it to start stopped
animationTime: 600, // How long the slide transition takes
hashTags: true, // Should links change the hashtag in the URL?
buildNavigation: true, // If true, builds and list of anchor links to link to each slide
pauseOnHover: true, // If true, and autoPlay is enabled, the show will pause on hover
startText: "Go", // Start text
stopText: "Stop", // Stop text
navigationFormatter: formatText // Details at the top of the file on this use (advanced use)
});
$("#slide-jump").click(function(){
$('.anythingSlider').anythingSlider(6);
});
});
</script>
</head>
<body>
<div class="anythingSlider">
<div class="wrapper">
<ul>[*]
[img]images/lmn001disegni031.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/disegni_02.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/lmn001disegni031.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_02.png[/img][*]
[img]images/lmn001disegni031.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/lmn001disegni024.png[/img][*]
[img]images/disegni_11.png[/img][*]
[img]images/disegni_02.png[/img]
[/list]
</div>
Ancora grazie e scusate per il disturbo 
Permessi di invio
Rispondi quotando