arnada Postad April 28, 2010 Dela Postad April 28, 2010 Hejsan! Håller på att koda en blogg och har nu fastnat då javascripts inte är något jag direkt kan.... När man kommenterar så ska kommentaren hamna i en pratbubbla http://www.willmayo.com/2007/02/10/css-speech-bubbles/ Allt verkar fungera utom en grej, pratbubblan har bara runda hörn på den senaste kommentaren.. Tack på Förhand! Kommentar.php (mellan <head>) <script type="text/JavaScript" src="rounded_corners.inc.js"></script> <script type="text/JavaScript"> window.onload = function() { settings = { tl: { radius: 10 }, tr: { radius: 10 }, bl: { radius: 10 }, br: { radius: 10 }, antiAlias: true, autoPad: true } var myBoxObject = new curvyCorners(settings, "rounded"); myBoxObject.applyCornersToAll(); } </script> Kommentar.php while($kommentar = mysql_fetch_array($data)){ echo '<br />'; echo '<div class="bubble">'; echo '<div class="rounded">'; echo '<blockquote>'; echo $kommentar['text']; echo '</blockquote>'; echo '</div>'; echo '<cite>'; echo '<strong>'.$kommentar['namn'].'</strong>'; echo ' '; echo $kommentar['timestamp']; echo '</cite>'; echo '</div>'; } style.css /* PRATBUBBLA */ /* Normal Bubble */ div.bubble { width: auto; font-size: 0.75em; margin-bottom: 24px; } div.bubble blockquote { margin: 0px; padding: 0px; border: 1px solid #c9c2c1; background-color: #fff; } div.bubble blockquote p { margin: 10px; padding: 0px; } div.bubble cite { position: relative; margin: 0px; padding: 7px 0px 0px 15px; top: 6px; background: transparent url(images/tip.gif) no-repeat 20px 0; font-style: normal; } /* Rounded Bubble */ div.bubble div.rounded { margin-bottom: 10px; border: 3px solid #fff; background-color: #b7e0ff; } div.bubble div.rounded blockquote { border: 0; background-color: transparent; } div.bubble div.rounded blockquote p { margin: 0px 10px; font-size: 16px; } div.bubble cite.rounded { position: relative; margin: 0px; padding-left: 15px; padding-top: 12px; top: 9px; background: transparent url(images/tip-rounded.gif) no-repeat 15px 0; } /* Pimped Bubble */ div#pimped.bubble { font-size: 16px; } div#pimped.bubble div.rounded { color: #fff; border: 3px solid #fff; background-color: #111; } div#pimped.bubble cite.rounded { background: transparent url(images/tip-pimped.gif) no-repeat 15px 0; } #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; } Citera Länk till kommentar Dela på andra webbplatser Fler delningsalternativ...
Recommended Posts
Delta i dialogen
Du kan skriva svaret nu och registrera dig senare, Om du har ett konto, logga in nu för att svara på inlägget.