Jump to content

how to display image in a round rectangle


isaac_cm

Recommended Posts

[!--sizeo:3--][span style=\"font-size:12pt;line-height:100%\"][!--/sizeo--]I saw some site that display images in a round rectangle instead of ordinary sharp rectangle any one know how to do that with scripts, I do not want of course to modify every image I have to be inside rounded frame

thanks[!--sizec--][/span][!--/sizec--]
Link to comment
Share on other sites

The best way to achieve this is to do it with a graphics editor or with CSS (using some tricky methods found on alistapart.com or with the new CSS method which you won't find supported until the next level of CSS is supported in browsers).

Either way, I don't think this is a PHP question any longer and Javascript certainly won't help you. I will leave it open, but I don't think anyone is going to be able to help you with a PHP solution.
Link to comment
Share on other sites

If you made a script like that, you could probably sell it. But how often are you going to have an image behind an entire object area? Most often you're going to have 2 images... one that is at the top of a block that has the top 2 edges rounded and then another image that handles the bottom.

Unless you setup the script to do a variety of options, I don't think that's a good idea. Plus, you're dealing with image quality and so on. This would be much easier to handle in an image editor.

EDIT: also, the OP is talking about rounding the edges of something like a DIV.... which isn't an image to begin with.

This is quickly becoming a non PHP issue. Convince me otherwise or this will quickly be moved/closed.
Link to comment
Share on other sites

[!--quoteo(post=372602:date=May 9 2006, 03:12 PM:name=ober)--][div class=\'quotetop\']QUOTE(ober @ May 9 2006, 03:12 PM) [snapback]372602[/snapback][/div][div class=\'quotemain\'][!--quotec--]
If you made a script like that, you could probably sell it.
[/quote]

Now there's a challenge. Got my thinking cap on.
Link to comment
Share on other sites

[!--quoteo(post=372842:date=May 10 2006, 08:12 AM:name=Barand)--][div class=\'quotetop\']QUOTE(Barand @ May 10 2006, 08:12 AM) [snapback]372842[/snapback][/div][div class=\'quotemain\'][!--quotec--]
Now there's a challenge. Got my thinking cap on.
[/quote]
Well there is such a script! Its called [b]Nifty Courners[/b] and requires no images and a small amount of CSS! Its done by javascript. The javascript does all the work for you.

[div align=\"center\"][!--sizeo:3--][span style=\"font-size:12pt;line-height:100%\"][!--/sizeo--][a href=\"http://www.html.it/articoli/nifty/index.html\" target=\"_blank\"]Nifty Couners[/a][!--sizec--][/span][!--/sizec--][/div]

I think I might have a little play with this later, oh and its free.

If you want to do in pure CSS then take [a href=\"http://www.google.co.uk/search?client=firefox-a&rls=org.mozilla%3Aen-GB%3Aofficial_s&hl=en&q=rounded+corners+in+CSS&meta=&btnG=Google+Search\" target=\"_blank\"]your pic here[/a] for whole load of articles/tutorials on doing so.
Link to comment
Share on other sites

How about a php class to acomplish that

[a href=\"http://www.phpclasses.org/browse/package/2681.html\" target=\"_blank\"]http://www.phpclasses.org/browse/package/2681.html[/a]

[!--quoteo--][div class=\'quotetop\']QUOTE[/div][div class=\'quotemain\'][!--quotec--]With PhpMyBorder you can add round corner borders. The first version of PhpMyBorder generates round corner images (gifs) 'on the fly' and caches them to improve performance. The newest version of PhpMyBorder creates the round border effect by CSS2 (without any images at all). The newest version also support raised and shadowed borders.[/quote]

Lite...
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.