[gelöst] 100% width iframe

Webdesign & Technik HTML & CSS
1

vickanka.bplaced.net/news-test.php

Das Problem ist, dass ich das ich im Twitter Widget als width nicht 100% einstellen kann.
Hat jemand eine Idee wie man das lösen kann und wie ich den unteren vertikalen Scrollbalken weg bekomme?

2

Einfach eine width-Angabe mit CSS hinzufügen. :p

3

??
Gibt kein iframe im Quellcode:

<?php
include ($_SERVER['DOCUMENT_ROOT']."/include/header.php");
?>
<h2>News</h2>

<div id="contenttable" style="width: 100%;">
<a class="twitter-timeline" width="100%" href="https://twitter.com/Hundeedel"  data-widget-id="361761440702558208" data-chrome="nofooter noheader transparent" lang="DE">Tweets von @Hundeedel</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<p>
Wer bei Twitter angemeldet ist, kann die neuesten News auch direkt über Twitter erfahren!<br>
<div  style="text-align: center;">
<a href="https://twitter.com/Hundeedel" class="twitter-follow-button" data-show-count="false" data-lang="de" data-size="large" data-show-screen-name="false">@Hundeedel folgen</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
</p>
<hr noshade size="3" align="left">
<div align="center">
<?php
include ($_SERVER['DOCUMENT_ROOT']."/include/ende.php");
?>
</div>
</div>
<img src="/include/Layout/twitter.png" width="100%"/>
</body>
</html>
4

Doch, das was du da von Twitter holst, wird als iFrame angezeigt, schau doch mal in den Seitenquelltext wenn er fertig durch PHP durchgerannt ist

5

Wie ich gerade sehe, wird der iFrame per JavaScript in die Seite eingefügt:

Du musst also entweder das JavaScript so anpassen, oder den iFrame manuell einfügen (falls das möglich ist).

6

Durch das Javascript von Twitter schau ich einfach nicht durch,
habe schon versucht, das iFrame loszuwerden und die Posts direkt in die Seite einzubinden, aber ich steig einfach nicht durch…

Bei der alten Api hatte ich es genau so gemacht, aber die funktioniert nicht mehr :frowning:
vickanka.bplaced.net/news-alt.php

<?php
include ($_SERVER['DOCUMENT_ROOT']."/include/header.php");
?>
<h2>News</h2>

<div id="contenttable">
<div id="twitter_div">
	<div id="twitter_update_list"></div>
</div>
<br>
Wer bei Twitter angemeldet ist, kann die neuesten News auch direkt über Twitter erfahren!<br>
<div  style="text-align: center;">
<a href="https://twitter.com/Hundeedel" class="twitter-follow-button" data-show-count="false" data-lang="de" data-size="large" data-show-screen-name="false">@Hundeedel folgen</a>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="/include/script/test.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

<hr noshade size="3" align="left">
<script src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<script type="text/javascript" src="/include/script/twitter.js"></script>
<script type="text/javascript" src="https://api.twitter.com/1/statuses/user_timeline/hundeedel.json?callback=twitterCallback2&count=999"></script>

<!--<script type="text/javascript" src="https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=hundeedel&callback=twitterCallback2&count=999"></script>-->
<div align="center">
<?php
include ($_SERVER['DOCUMENT_ROOT']."/include/ende.php");
?>
</div>
</div>
<img src="/include/Layout/twitter.png" width="100%"/>
</body>
</html>
7

Sollte document.getElementById('#twitter-widget-1').outerHTML = $("#twitter-widget-1").contents().find("body").html(); nicht funktionieren?

Versuche es gerade erstmal in Greasemonkey und da funktioniert es nicht =(

8

Ok, habs jetzt per CSS hingebogen:

div#TweetFeed iframe { width: 100%; }

dazu ein

, der das iframe umschließt…