Skip to Content Skip to Menu

🌲 Merry Christmas! Great savings on Professional and Developer Memberships! Get 25% off now with code XMAS-2024!

Portrait picture with Polaroid style !

  • carlaf
  • carlaf
  • OFFLINE
  • Posts: 3
  • Thanks: 0
  • Karma: 0
17 years 3 months ago #44510 by carlaf
Replied by carlaf on topic Re:Portrait picture with Polaroid style !
hummm I'm still working on it.... and it is in portugues..
but I'll let the profile open for you to be able to see the portrait...
I didn't make the polariod style because is not the case on my site but you can see the border around the pic...
Like I said before I just add class to the <tr> and <td> (foto1 and foto2 ) and my css is:

.foto1{

BORDER-RIGHT: #898989 1px solid;
PADDING: 0;
BORDER-BOTTOM: #898989 1px solid;}

.foto2{
BORDER-RIGHT: #a7a199 1px solid;
PADDING: 10px;
BORDER-TOP: #d3ccc2 1px solid;
BACKGROUND: #ffffff;
BORDER-LEFT: #d3ccc2 1px solid;
BORDER-BOTTOM: #a7a199 1px solid
}

the link is:
www.osviajantes.com/site

and click on the 2nd link (associados)
is just the admin and my profile.....(still a lot to do and install but you can see the portrait).

carla.

Please Log in or Create an account to join the conversation.

  • carlaf
  • carlaf
  • OFFLINE
  • Posts: 3
  • Thanks: 0
  • Karma: 0
17 years 3 months ago #44511 by carlaf
Replied by carlaf on topic Re:Portrait picture with Polaroid style !
it works lovely....;-)
just depending on your css to make it....
give more padding-bottom and you gonna have polaroid style.

Please Log in or Create an account to join the conversation.

17 years 3 months ago #44533 by tomsawyer1234
Replied by tomsawyer1234 on topic Re:Portrait picture with Polaroid style !
Oki but how can I rotate the pics?

tks.

Please Log in or Create an account to join the conversation.

  • nickb
  • nickb
  • OFFLINE
  • Posts: 9
  • Thanks: 0
  • Karma: 1
17 years 2 months ago #48782 by nickb
Replied by nickb on topic Portrait Polaroid style !
Hi here is my attempt to generate a Polaroid style portrait... everything is done by some css and core hack in order to support it...as the people above have done... i attache some scrrenshot for you to see the results...the site is still on production and so i cannot give you a live link
the first is the coomunity main page where random member that have uploaded a picture are displayed (always in a mini polaroid fashion)

for the size of portrait and avatar i modified the gd2 data of cb so it generate 200x200 portrait picture fixed and 100x100 avatars...there is some distortion in this but i did rather prefer distortion then different sized on the site..give a more ordered layout...in any case to avoid distortion ur user will have to upload squuare or near squared picture...so is not that hard...

Post edited by: nickb, at: 2007/10/26 01:51
Attachments:

Please Log in or Create an account to join the conversation.

  • nickb
  • nickb
  • OFFLINE
  • Posts: 9
  • Thanks: 0
  • Karma: 1
17 years 2 months ago #48784 by nickb
Replied by nickb on topic Re:Portrait Polaroid style !
Attachments:

Please Log in or Create an account to join the conversation.

  • nickb
  • nickb
  • OFFLINE
  • Posts: 9
  • Thanks: 0
  • Karma: 1
17 years 2 months ago #48785 by nickb
Replied by nickb on topic Re:Portrait Polaroid style !
here is the portrait in profile page... (also some css customization on the connection "my buddies" tab too..)



as u can see i wen a bit further than jus polaroid look...i went with some grunge effect...the adesive tape is transparent alpha so template bg sees under and add the effect of really been attached to it... under the polaroid the username is laso been generated and styled and attached in that white space of a polaroid...

cb is great and just working on some basic css can be whatever u want...one of the best piece of code out here!!! thanks to be there...
Post edited by: nickb, at: 2007/10/26 01:37

Post edited by: nickb, at: 2007/10/26 01:40
Attachments:

Please Log in or Create an account to join the conversation.

Moderators: beatnantkrileon
Powered by Kunena Forum