Valutazione 4.87/ 5 (100.00%) 5838 voti

Condividi:        

Box HTML con angoli arrotondati con slide incluse

Problemi di HTML? Di PHP, ASP, .NET, JSP, Perl, SQL, JavaScript, Visual Basic..?
Vuoi realizzare programmi in C, C++, Java, Ruby o Smalltalk, e non sai da che parte cominciare?
Entra qui e troverai le risposte!

Moderatori: Triumph Of Steel, archimede

Box HTML con angoli arrotondati con slide incluse

Postdi vale_sansoni » 21/06/12 10:45

Ciao!!

Ho realizzato per il piede di un sito 3 classici box estensibili con gli angoli arrotondati, incollando procedimenti macchinosi che ho trovato in giro.
2 dei 3 box sono estensibili ed è tutto ok.
Il 3° box invece ho dovuto farlo fisso come altezza, perché ospita delle slide che ruotano mostrando parole diverse ogni pochi secondi.

Questo per dei casini vari mi ha fatto perdere la stondatura dei due angoli bassi del box.

Avete qualche suggerimento? Vi incollo un po' di codice. Grazie in anticipo
Codice: Seleziona tutto
<script type="text/javascript" src=ajax-googleapis-com></script>

<script>
$(document).ready(function(){
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$('#slideshow > div:first')
.slideUp(1000)
.next()
.slideDown(1000)
.end()
.appendTo('#slideshow');
}, 9000);
});
</script>

<style type="text/css">

body { margin: 0px; padding: 0px; background: #EAEAEA; }

h1 { margin: 0px 0px 1px 15px; padding: 0px; font-family: courier new; color: dimgray; font-size: 12px; font-weight: normal; }

a { color: black; }
a:hover { color: white; background: darkred; text-decoration: none; }

#servizi a { text-decoration: none; }

a.img { text-decoration: none; background: none; }
img { border: 0px; }

#piede td { color: white; font-size: 14px; font-family: courier new; margin: 15px; 0px; 0px; 15px; }

#piede a { color: white;}
#piede a:hover { color: orange; background: none; }

dt { margin:0 1px 0 1px; position:relative; top:-1px; border-top: 1px solid; }

dt b { margin:0 1px 0 1px; position: relative; top:-2px; display: block; border-top: 1px solid;}

dd { margin:0 1px 0 1px; position: relative; bottom: -1px; border-bottom: 1px solid;}

.dd-content { margin:0 1px 0 1px; position:relative; bottom:-2px; border-bottom: 1px solid; }

.box1 { background-color: #9DBB61; }

.box1 dt { border-top-color: #9DBB61; }

.box1 dt b { border-top-color: #9DBB61; font-family: courier new; font-size: 18px; padding: 10px; }

.box1 dd { border-bottom-color: #9DBB61; }

.box1 .dd-content { border-bottom-color: #9DBB61; padding: 0px; font-family: courier new; font-size: 14px; }

.box2 { background-color: #DB9418; }

.box2 dt { border-top-color: #DB9418; }

.box2 dt b { border-top-color: #DB9418; font-family: courier new; font-size: 18px; margin: 10px 5px 0px 10px; padding: 0px; }

.box2 dd { border-bottom-color: #DB9418; }

.box2 .dd-content { border-bottom-color: #DB9418; padding: 0px; font-family: courier new; font-size: 14px; }

#slideshow > div { position: absolute; }

</style>

</head>

<body>

   <tr>
                  <td width="33%" valign="top">
                     <dl class="box1" style="margin: 8px 8px 15px 0px; height: 380px;">
                        <dt>
                           <b>Parole</b>
                        </dt>
                        <dd>
                           <div class="dd-content" style="margin: 5px 20px 0px 15px; height: 229px;" id="slideshow">
                              <div>
                                 testo 1
                              </div>
                              <div>
                                 testo 2
                              </div>
                              <div>
                                 testo 3
                              </div>
                              <div>
                                 testo 4
                              </div>
                           </div>
                        </dd>
                     </dl>
                  </td>
vale_sansoni
Newbie
 
Post: 4
Iscritto il: 21/06/12 10:24

Sponsor
 

Postdi archimede » 21/06/12 12:23

Il codice che hai postato mi pare incompleto/scorretto. Hai un url dove si può vedere il problema?

Alessandro
archimede
Moderatore
 
Post: 2755
Iscritto il: 07/11/02 12:41
Località: Genova


Torna a Programmazione


Topic correlati a "Box HTML con angoli arrotondati con slide incluse":


Chi c’è in linea

Visitano il forum: Nessuno e 1 ospite