Log in

View Full Version : Clip:rect failing


Vaonline
07-21-2012, 06:11 PM
Hello.

Im using the "clip:rect" to put an space of an external website in my webpage:


<iframe id="proba" SCROLLING=NO
width="660" height="450" src="http://www.tu.tv/videos/azumanga-daioh-01"></iframe>​​​​​​​​​​​​​​​

<style type="text/css">
#proba {
position: absolute; clip:rect ( 900 628 1300 70 );
}
</style>​


I am trying this code in jsfiddle.net and the clip:rect property only cuts the bottom and the right, but not the left or the upperside.

¿Why does it fails?

Why do i use an iframe? -> I am iframing a stream service, clipping the video instead of copying the embed. The "http://www.tu.tv/videos/azumanga-daioh-01" is the name of the chapter, the number 01 changes by chapter, 02, 03 so i use excel and i save lots of hours but first i need to clip it well.

Thanks.
jscheuer1
07-21-2012, 09:13 PM
I've never been real clear on what clip does. I think you need a block level element (iframes are inline). Even if you set its display to block, iframes are tricky, and as I say, clip is too. There seem to be a number of ways you can write it, and then there's visualizing the spacial math involved.

Anyways, this seems to work out fairly well:


<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#container {
position: relative; overflow: hidden; width: 610px; height: 415px;
}
#proba {
position: absolute; width: 610px; height: 700px; top: -285px; left: 0px; display: block; border-width: 0;
}
</style>
</head>
<body>
<p>Some other content</p>
<div id="container"><iframe id="proba" scrolling=no frameborder=0 src="http://www.tu.tv/videos/azumanga-daioh-01"></iframe></div>
</body>
</html>
Vaonline
07-21-2012, 10:17 PM
Thank you so much!!!
If any problem ill edit this post!