Results 1 to 2 of 2

Thread: Javascript round circle image

  1. #1
    Join Date
    Jul 2009
    Location
    Binus University
    Posts
    472
    Thanks
    78
    Thanked 21 Times in 21 Posts

    Default Javascript round circle image

    Hi everyone,

    I need a script to round the image to circle shape, i try CSS3:
    Code:
    .round img{width: 118px; height: 118px; -webkit-border-radius: 59px; -moz-border-radius: 59px; border-radius: 59px;}
    The problem, if the image is not perfectly rectangular the image layout after css is not proportional.

    So may be javascript can help to crop and adjust the image proportion.

    Is there any advice for my problem here?
    _____________________

    David Demetrius // davejob
    _____________________

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    Is a background-image optional? Take for example the image in my footer here http://fofwebdesign.co.uk/about.php It's the same image used at the top of the page too (it's rectangular)

    So, if you use a div that's square, set the pic as a background-image with border-radius:50%;, and maybe adjust the size with background-size:?; like I have, it will hopefully be something you can use.
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

Similar Threads

  1. Replies: 1
    Last Post: 10-19-2010, 08:26 AM
  2. Round circle image in webpage
    By pointman in forum Graphics
    Replies: 4
    Last Post: 07-15-2008, 05:16 PM
  3. Circle Algorithm Problem
    By mburt in forum JavaScript
    Replies: 10
    Last Post: 02-07-2007, 04:04 PM
  4. Circle Trail Text Help!
    By lawrence_of_arabia92 in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 04-28-2006, 12:13 PM
  5. How to rotate 6 images in a circle?
    By sleuthy1 in forum HTML
    Replies: 2
    Last Post: 01-17-2006, 01:58 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •