Youtube player on website

  • (4 Pages)
  • +
  • 1
  • 2
  • 3
  • 4

56 Replies - 1492 Views - Last Post: 18 May 2014 - 02:21 AM Rate Topic: -----

#31 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 10 May 2014 - 07:15 PM

You could completely center it by removing the other margins and just using,

margin: auto
Was This Post Helpful? 0
  • +
  • -

#32 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 10 May 2014 - 07:16 PM

Okay I did so, so how do I stretch it out over the screen?
Was This Post Helpful? 0
  • +
  • -

#33 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 10 May 2014 - 07:23 PM

You can make the screen bigger by changing these attributes,

<iframe width="640" height="360"

And then change the width to larger than the width you place on the player.
Was This Post Helpful? 0
  • +
  • -

#34 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 10 May 2014 - 07:23 PM

http://i.imgur.com/b2UQOk6.jpg How would I make it more to the right and fit in the monitor sigh :(

This post has been edited by sprokls: 10 May 2014 - 07:26 PM

Was This Post Helpful? 0
  • +
  • -

#35 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 10 May 2014 - 07:30 PM

position:absolute;
top: 50%;
left: 50%;
width:700px;
height:360px;
margin-top: -155px; /*set to a negative number 1/2 of your height*/
margin-left: -350px; /*set to a negative number 1/2 of your width*/ 



Next test...
Was This Post Helpful? 1
  • +
  • -

#36 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 11 May 2014 - 03:56 AM

http://i.imgur.com/FSSLG8C.jpg at the moment it looks like this :)
Was This Post Helpful? 0
  • +
  • -

#37 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 11 May 2014 - 04:01 AM

http://i.imgur.com/HYoVOPZ.jpg <- Updated but it wont go more small I can't lower the width any more :/
#player {
	position:absolute;
	top: 25%;
	left: 5%;
	width:2px;
	height:345px;
	margin-top: -172.5px; /*set to a negative number 1/2 of your height*/
	margin-left: -1px;
}

Was This Post Helpful? 0
  • +
  • -

#38 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 11 May 2014 - 05:57 AM

Those are positioning numbers.

25% means it should have 25% of the available screen above it.
It should have 5% to it's left.

Lower the width in the iframe size first. That is what will make the biggest difference.
Was This Post Helpful? 0
  • +
  • -

#39 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 11 May 2014 - 06:48 AM

http://i.imgur.com/i9Bqz2V.png <- looks like that on my 18.5" monitor
http://i.imgur.com/KC2LXAJ.jpg <- 23" screen
Was This Post Helpful? 0
  • +
  • -

#40 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 11 May 2014 - 06:55 AM

The 18.5 monitor looks awsome! I like the way you did that.

To get that kind of look on everything could be difficult.

Just brainstorming but,

You could do a width of 80% on the iframe and say a 5% margin on the left and right. Then play with the numbers until you get the look you are wanting.
Was This Post Helpful? 0
  • +
  • -

#41 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 11 May 2014 - 07:05 AM

Is there no way to make it autofit for all resolutions?
Was This Post Helpful? 0
  • +
  • -

#42 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 11 May 2014 - 07:08 AM

That would be why you need to play with it. It looks like a specific width from the monitor to the edge of the screen, but you would need to find that %. Once you find the sweetspot it will work. I would say start with either 5% or 15% and work you way until it fits how you want. Just modify the iframe screen so your total width equals 99% - 100%
Was This Post Helpful? 0
  • +
  • -

#43 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 11 May 2014 - 07:55 AM

There must be an easier way :-(
Was This Post Helpful? 0
  • +
  • -

#44 astonecipher  Icon User is offline

  • D.I.C.
  • member icon

Reputation: 802
  • View blog
  • Posts: 3,510
  • Joined: 03-December 12

Re: Youtube player on website

Posted 11 May 2014 - 08:23 AM

That is a problem trying to align an element with a background image, you have to fine tune the placement.
Was This Post Helpful? 0
  • +
  • -

#45 sprokls  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 10-May 14

Re: Youtube player on website

Posted 11 May 2014 - 09:29 AM

How would I make it easier? How would I make that background not an image if you understand me?
Was This Post Helpful? 0
  • +
  • -

  • (4 Pages)
  • +
  • 1
  • 2
  • 3
  • 4