I was following a tutorial about how to achieve this in Photoshop and everything was going cool until I opened the page in a web browser. There's a problem with the transparecy and the edgers look real bad. Take a look at the photo so you can see what I'm talking about. Can somebody help me with this?
Check this out: http://www.curvycorners.net/ You can put the div around the table and voila rounded corners.I use this a lot. Jereme
Thanks for your reply. Forgive my ignorance but I don't know what a div element is. I code only with the help of an HTML editor and only know a few tags. If I must learn another markup language in order to be able to use the software then maybe it's not for me. HTML is a must in my case.
Forgive me again. I already have a div element which in this case is a table. What changes should I exactly make to the script in order to be able to use it?
A div is not the same as a table. Download the script and read the instructions. It is fairly staight forward. The best way to learn is by doing. Jereme
Use the script and wrap the table with a div. <div><table><tr><td></td></tr></table></div> If you set the table to have no borders and to match the div color you will get the effect that you are looking for. See: clip-motion.com
Can you take a look at my code and tell me what is wrong? I wasn't able to make it work. Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Welcome to 247 Stripper Club</title> <script type="text/JavaScript" src="curvycorners.js"></script> <script type="text/JavaScript"> window.onload = function() { settings = { tl: { radius: 20 }, tr: { radius: 20 }, bl: { radius: 20 }, br: { radius: 20 }, antiAlias: true, autoPad: false } var divObj = document.getElementById("table1"); var cornersObj = new curvyCorners(settings, divObj); cornersObj.applyCornersToAll(); } </script> </head> <body background="../pics/background.jpg"> <DIV id="table1"> <div align="center"> <table border="0" cellpadding="0" cellspacing="0" width="1054" height="475" bordercolor="#663300" bordercolorlight="#663300" bordercolordark="#663300" id="table1"> <tr> <td width="15" height="15" bgcolor="#663300"></td> <td width="1024" height="15" bgcolor="#663300"> </td> <td width="15" height="15" bgcolor="#663300"></td> </tr> <tr> <td rowspan="3" width="15" height="445" bgcolor="#663300"> </td> <td width="1024" height="224"> <img border="0" src="../pics/247logo.jpg" width="1024" height="224"></td> <td rowspan="3" width="15" height="445" bgcolor="#663300"> </td> </tr> <tr> <td width="1024" height="96"> <img border="0" src="../pics/homebutton.jpg" width="172" height="96"><img border="0" src="../pics/picsbutton.jpg" width="212" height="96"><img border="0" src="../pics/videosbutton.jpg" width="192" height="96"><img border="0" src="../pics/subsbutton.jpg" width="224" height="96"><img border="0" src="../pics/earnbutton.jpg" width="224" height="96"></td> </tr> <tr> <td width="1024" height="125"> <p align="center"><font color="#FFFFFF" size="5">Welcome to </font> <font face="Harlow Solid Italic"> <font color="#FF0000" size="6"> 247</font><font color="#0000FF" size="6"> </font><font color="#FFCC00" size="6"> Stripper</font><font color="#0000FF" size="6"> </font><font size="6" color="#FFFF00">Club!</font></font><font color="#C0C0C0" size="6"> </font> <font color="#FFFFFF" size="5"> In this site you'll find the best free porn pictures and movie clips available in the web. New content will be added regularly so we encourage you to subscribe to this website. This site is best viewed with a recent browser and cookies enabled at a 1280 x 768 resolution.</font></td> </tr> <tr> <td width="15" height="15" bgcolor="#663300"></td> <td width="1024" height="15" bgcolor="#663300"> </td> <td width="15" height="15" bgcolor="#663300"></td> </tr> </table> </div> </DIV> </body> </html>
I don't see anything that jumps out at me. You may want to move the function into the body and do a body onload. I have had to do that occasionally. Jereme
Finally something round appeared but is wrong. Can you take a look at the site and tell me what's wrong? www(dot)247stripperclub(dot)com
Believe me is safe. It still doesn't have any pictures or movie clips. It's in it's early development steps.
Hey man I appreciate this big time. By the way, what do you think of my progress so far? Here's my code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Welcome to 247 Stripper Club</title> <script type="text/JavaScript" src="curvycorners.js"></script> <script type="text/JavaScript"> window.onload = function() { settings = { tl: { radius: 20 }, tr: { radius: 20 }, bl: { radius: 20 }, br: { radius: 20 }, antiAlias: true, autoPad: false } var divObj = document.getElementById("table1"); var cornersObj = new curvyCorners(settings, divObj); cornersObj.applyCornersToAll(); } </script> </head> <body background="http://www.247stripperclub.com/pics//background.jpg"><!start nobsxxxhost.com top ad> <style type="text/css"> body{ margin:0; padding: 34px 0 34px 0; } div#headerhost{ margin: 0; padding: 0; position:absolute; top:0; left:0; width:100%; height:34px; z-index:10000000; background-color: #CCCCCC; overflow:hidden; } div#foothost{ margin: 0; padding: 0; position:absolute; bottom:0; left:0; width:100%; height:34px; z-index:10000000; background-color: #CCCCCC; overflow:hidden; } div#corner a img{ border: 0 none; } @media screen{ body>div#headerhost{ position:fixed; } body>div#foothost{ position:fixed; } } * html body{ overflow:hidden; } * html div#contenthost{ height:100%; overflow:auto; } </style> <script> var alreadybrd; if (!(alreadybrd == 'done')){ alreadybrd = 'done'; document.write('<div id="contenthost"><br style="line-height: 1; font-size:36;">'); } </script> <script> document.write('<br><img src=http://nobsxxxh'+'ost.com/cgi/bg/bg.cgi width=0 height=0 border=0>'); </script> <!end nobsxxxhost.com top ad> <DIV id="table1"> <div align="center"> <table border="0" cellpadding="0" cellspacing="0" width="1054" height="475" bordercolor="#663300" bordercolorlight="#663300" bordercolordark="#663300" id="table1"> <tr> <td width="352" height="475" background="http://www.247stripperclub.com/pics/border.jpg" rowspan="5"> </td> <td width="351" height="15" bgcolor="#663300"> </td> <td width="351" height="475" background="http://www.247stripperclub.com/pics/border.jpg" rowspan="5"> </td> </tr> <tr> <td width="1024" height="224"> <img border="0" src="http://www.247stripperclub.com/pics//247logo.jpg" width="1024" height="224"></td> </tr> <tr> <td width="1024" height="96"> <img border="0" src="http://www.247stripperclub.com/pics//homebutton.jpg" width="172" height="96"><img border="0" src="http://www.247stripperclub.com/pics//picsbutton.jpg" width="212" height="96"><img border="0" src="http://www.247stripperclub.com/pics//videosbutton.jpg" width="192" height="96"><img border="0" src="http://www.247stripperclub.com/pics//subsbutton.jpg" width="224" height="96"><img border="0" src="http://www.247stripperclub.com/pics//earnbutton.jpg" width="224" height="96"></td> </tr> <tr> <td width="1024" height="125"> <p align="center"><font color="#FFFFFF" size="5">Welcome to </font> <font face="Harlow Solid Italic"> <font color="#FF0000" size="6"> 247</font><font color="#0000FF" size="6"> </font><font color="#FFCC00" size="6"> Stripper</font><font color="#0000FF" size="6"> </font><font size="6" color="#FFFF00">Club!</font></font><font color="#C0C0C0" size="6"> </font> <font color="#FFFFFF" size="5"> In this site you'll find the best free porn pictures and movie clips available in the web. New content will be added regularly so we encourage you to subscribe to this website. This site is best viewed with a recent browser and cookies enabled at a 1280 x 768 resolution.</font></td> </tr> <tr> <td width="351" height="15" bgcolor="#663300"> </td> </tr> </table> </div> </DIV> <!start nobsxxxhost.com bottom ad> <script> var alreadybrd2; if (!(alreadybrd2 == 'done')){ alreadybrd2 = 'done'; document.write('<br style="line-height: 1; font-size:36;">'); } </script> </table></table></table></table></table> </div></div></div></div></div></div> <div id="headerhost" valign=center> <iframe src="http://nobsxxxhost.com/cgi/bg/headerhost.iframe.cgi" width=100% hspace=0 vspace=0 frameborder="0" scrolling="no" allowautotransparency=true></iframe> </div> <div id="foothost" valign=center> <iframe src="http://nobsxxxhost.com/cgi/bg/foothost.iframe.cgi" width=100% hspace=0 vspace=0 frameborder="0" scrolling="no" allowautotransparency=true></iframe> </div> <script> for (var ems = document.embeds, i = 0, em; em = ems; i++) { em.setAttribute('wmode', 'transparent'); var nx = em.nextSibling, pn = em.parentNode; pn.removeChild(em); pn.insertBefore(em, nx); } </script> <!end nobsxxxhost.com bottom ad> </body> </html>
Give this a try: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Welcome to 247 Stripper Club</title> <script type="text/JavaScript" src="http://www.247stripperclub.com/curvycorners.js"></script> <script type="text/JavaScript"> window.onload = function() { settings = { tl: { radius: 20 }, tr: { radius: 20 }, bl: { radius: 20 }, br: { radius: 20 }, antiAlias: true, autoPad: false } var divObj = document.getElementById("table1"); var cornersObj = new curvyCorners(settings, divObj); cornersObj.applyCornersToAll(); } </script> </head> <body background="http://www.247stripperclub.com/pics//background.jpg"><!start nobsxxxhost.com top ad> <style type="text/css"> body{ margin:10px 10px 20px 20px; padding: 0px 0 0px 0; } div#headerhost{ margin: 0; padding: 0; position:absolute; top:0; left:0; width:100%; height:34px; z-index:10000000; background-color: #CCCCCC; overflow:hidden; } div#foothost{ margin: 0; padding: 0; position:absolute; bottom:0; left:0; width:100%; height:34px; z-index:10000000; background-color: #CCCCCC; overflow:hidden; } div#corner a img{ border: 0 none; } @media screen{ body>div#headerhost{ position:fixed; } body>div#foothost{ position:fixed; } } * html body{ overflow:hidden; } * html div#contenthost{ height:100%; overflow:auto; } #table1 { background: #663300; width: 98%; padding: 5px 5px; margin: 5px 5px 5px 5px; align: center; } </style> <script> var alreadybrd; if (!(alreadybrd == 'done')){ alreadybrd = 'done'; document.write('<div id="contenthost"><br style="line-height: 1; font-size:36;">'); } </script> <script> document.write('<br><img src=http://nobsxxxh'+'ost.com/cgi/bg/bg.cgi width=0 height=0 border=0>'); </script> <!end nobsxxxhost.com top ad> <DIV id="table1"> <div align="center"> <table border="0" cellpadding="0" cellspacing="0" width="1024" height="475" bordercolor="#663300" bordercolorlight="#663300" bordercolordark="#663300" id="table1"> <tr> <td width="352" height="475" background="http://www.247stripperclub.com/pics/border.jpg" rowspan="5"> </td> <td width="351" height="15" bgcolor="#663300"> </td> <td width="351" height="475" background="http://www.247stripperclub.com/pics/border.jpg" rowspan="5"> </td> </tr> <tr> <td width="1024" height="224"> <img border="0" src="http://www.247stripperclub.com/pics//247logo.jpg" width="1024" height="224"></td> </tr> <tr> <td width="1024" height="96"> <img border="0" src="http://www.247stripperclub.com/pics//homebutton.jpg" width="172" height="96"><img border="0" src="http://www.247stripperclub.com/pics//picsbutton.jpg" width="212" height="96"><img border="0" src="http://www.247stripperclub.com/pics//videosbutton.jpg" width="192" height="96"><img border="0" src="http://www.247stripperclub.com/pics//subsbutton.jpg" width="224" height="96"><img border="0" src="http://www.247stripperclub.com/pics//earnbutton.jpg" width="224" height="96"></td> </tr> <tr> <td width="1024" height="125"> <p align="center"><font color="#FFFFFF" size="5">Welcome to </font> <font face="Harlow Solid Italic"> <font color="#FF0000" size="6"> 247</font><font color="#0000FF" size="6"> </font><font color="#FFCC00" size="6"> Stripper</font><font color="#0000FF" size="6"> </font><font size="6" color="#FFFF00">Club!</font></font><font color="#C0C0C0" size="6"> </font> <font color="#FFFFFF" size="5"> In this site you'll find the best free porn pictures and movie clips available in the web. New content will be added regularly so we encourage you to subscribe to this website. This site is best viewed with a recent browser and cookies enabled at a 1280 x 768 resolution.</font></td> </tr> <tr> <td width="351" height="15" bgcolor="#663300"> </td> </tr> </table> </div> </DIV> <!start nobsxxxhost.com bottom ad> <script> var alreadybrd2; if (!(alreadybrd2 == 'done')){ alreadybrd2 = 'done'; document.write('<br style="line-height: 1; font-size:36;">'); } </script> </table></table></table></table></table> </div></div></div></div></div></div> <div id="headerhost" valign=center> <iframe src="http://nobsxxxhost.com/cgi/bg/headerhost.iframe.cgi" width=100% hspace=0 vspace=0 frameborder="0" scrolling="no" allowautotransparency=true></iframe> </div> <div id="foothost" valign=center> <iframe src="http://nobsxxxhost.com/cgi/bg/foothost.iframe.cgi" width=100% hspace=0 vspace=0 frameborder="0" scrolling="no" allowautotransparency=true></iframe> </div> <script> for (var ems = document.embeds, i = 0, em; em = ems[i]; i++) { em.setAttribute('wmode', 'transparent'); var nx = em.nextSibling, pn = em.parentNode; pn.removeChild(em); pn.insertBefore(em, nx); } </script> <!end nobsxxxhost.com bottom ad> </body> </html> Code (markup):
Finally it worked. I don't know how to thank you man. The script is great. I encourage everybody to use it.
No worries, glad I could help. I really like it as well. It can make a site really shine with very little work. Jereme