Jump to content


Photo

Cut pixels of picture without having to save the cropped file


  • Please log in to reply
2 replies to this topic

#1 Silvar

Silvar

    Member

  • Members
  • PipPip
  • 28 posts

Posted 26 January 2013 - 12:03 PM

I've put this into the PHP section as I might think that PHP has to be used in this situation. Don't know if it's possible with CSS.
I got these pictures on my site from my latest YouTube uploads. These god damn pictures included in the xml file my script is linked to, got stupid black frames in top and bottom, even though the scaling of the picture is what it has to be. It's just a stupid thing from youtube i reckon.

But I want to cut these black frames away from the top and the bottom of the picture. The picture is set as a background image right now, as I tried to fix the background with minus properties in background-position, but didn't work.

Do I have to use PHP for this or is there any way of doing this in CSS?

I've searched around for solutions and it can't be true that I have to get the file, cut pixels and then save it on my own domain to get the black boxes cropped of. My logical sense tells me that there has to be easier solutions not to show these pixels form the thumbnail.

Thank you in advance.

#2 White_Lily

White_Lily

    Advanced Member

  • Members
  • PipPipPip
  • 521 posts

Posted 26 January 2013 - 12:11 PM

you could make the box the background image sits in the same size as the image you want to show, then say:

#box id/class
{
background: url("../filepath/filename") center no-repeat;
}

Edited by White_Lily, 26 January 2013 - 12:11 PM.

"In order to be irreplaceable, one needs to be different from another."

CMS Development: http://cms.janedeaslart.co.uk/


#3 Silvar

Silvar

    Member

  • Members
  • PipPip
  • 28 posts

Posted 26 January 2013 - 02:18 PM

you could make the box the background image sits in the same size as the image you want to show, then say:

#box id/class
{
background: url("../filepath/filename") center no-repeat;
}

This is one of the moments where I'm thinking: "Ofcourse, that's obvious". I put position: relative; to the image inside the div and made a top: -10px.
Thanks for guiding me into using my own brain :)




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com