I made an iframe at Rubiks3x3.com to show users of my page algrithms. You get the following code:
<iframe height="270" width="300px" scrolling="no" frameborder="0" src="https://rubiks3x3.com/algorithm/"></iframe>
There is the 'scrolling attribute. My Validator says it is obsolete and gives me a link where it says I should add the attribute "overflow" to the root element of the containing document, but I can't find a way to do so because I can't find a way to contact elements inside the document embedded. Is CSS really the right way to do something like that? If yes how; and if no what else can I use?
Related
I am showing embedded iframe document in my application, what I am trying to do is hiding menu button from top bar in Webview of this embedded iframe. I am using DocumentCloud platform for storing and retrieving the documents, DocumentCloud gives me the link of my document and I add that my html and rendering it using react-native-webview. This is my iframe tag link, you can open it browser. I did tried achieving this using changing fields/options in iframe src url which is probably best solution for it, but I couldn't find any option to turn that thing off in document cloud documentation. I am getting this results.
I want to hide the the menu icon shown in top bar in above image.
iFrame looks like this
<iframe loading="lazy" src="https://www.documentcloud.org/documents/282753-lefler-thesis.js" width="700" height="800" sandbox="allow-scripts allow-same-origin allow-popups allow-forms allow-popups-to-escape-sandbox" frameborder="0"></iframe>
This is how I am rendering Webview.
<WebView
scrollEnabled={false}
onMessage={callback}
style={styles.container}
containerStyle={styles.viewContainer}
source={{
html: htmlRender(
iframe
),
}}
/>
htmlRender method is wrapping iframe within in html and doing some styling and reporting the height and width of iframe.
You can injectJavaScript and query these buttons with 2 selectors:
document.querySelector('.hamburger')
returns div with svg
document.querySelector('.fullscreen')
returns span with svg
Hiding is something like:
document.querySelector('.hamburger').style.display = "none";
I would like to put into my Jenkins view another HTML, and tried to do this that way, adding that as a text section:
<iframe style="border: 0;position: relative;" width=1000px height=300px src="http://my_source.html">
Error
</iframe>
And I see it doesn't work, it doesn't even show on the view's source. Another part of HTML code put into text section works fine. I found that XFrame-Filter plugin configured to ALLOW-FROM http://my_source.html can solve that problem, but unfortunately it doesn't. Putting that content by object or link rel doesn't work too. At this moment, I have no idea how to make it work. Could you help me with that?
as the title on top will iframe in input type hidden being load when page is loaded?
For ex:
<input type="hidden" value="<iframe width="810" height="415" src="//www.youtube.com/embed/5th14OTyeqU" frameborder="0" allowfullscreen></iframe>" />
No, it won't load.
You can't put html elements inside the value attribute of an input tag like that. Generally speaking (I won't say always, since html is sometimes very, very weird), html attributes cannot contain more html.
If you're looking to prevent the youtube elements actually loading on the screen as you mentioned in your comment, your best bet is to be found in the answers of this question.
You can use the css style='display:none', and an id for your iframe, like this:
<iframe id="youtube" width="810" height="415" src="//www.youtube.com/embed/5th14OTyeqU" style="display:none;" frameborder="0" allowfullscreen></iframe>
<input type="text" id="name"/>
After that, you can use javascript code:
$("#name").focus(function(){
$("#youtube").show();
});
So when you click on the input text field, the iframe should show up (this way you can test if it works).
UPDATE: I think you also need an API for loading that video there, it will not work without that. You can use this link to get more details: YouTube Player API Reference for iframe Embeds
I am using iframe in jsp page.
<iframe frameborder="1" src="view/jsp/refreshChat.jsp" STYLE='width:20%;' />
But when I run that page its gives a blank page.
This is an example of an iframe code:
<iframe src="page_to_show_inside_iframe.jsp" style="width:100%; height:250px;">
<p>Text to show in browsers that don't support iframes.</p>
</iframe>
Perhaps you're lacking height value.
Also, be sure the value for src attribute is correctly referenced, ie. relative path is built OK ( if your parent page URL is http://localhost:8080/mysite/myparentpage.jsp try to load your child page pasting src value instead your parent page's name, http://localhost:8080/mysite/view/jsp/refreshChat.jsp , test this in a new window or tab)
Check if src="view/jsp/refreshChat.jsp" is proper. From what location You use this?
DO not forget to add http:// to your web url. Also, avoid localhost. Use the IP address.
I have a page that contains an iframe element. I want to have some text on the main page when clicked to change the iframe source. I can do that with an "a href" tag but the main page resets to the top instead of where the user was last on the page vertically. If I use an input type=button element, then it works just fine without resetting to the top of the main page. However, I want the look of just text on the page (with an underline) instead of a button look. How can I do this?
use target
Go to page 2
<iframe src="page1.html" frameborder="0" name="test"></iframe>
you can use a div or span (actually pretty much any element) instead of a button
<div onclick="iframe.src='new.html'" class="lookcool">sometext</a>
Not sure what you have done so far, but it seems like you want to change the page displayed in an iframe. To do that with a link, you can use target or javascript:
Target:
link
<iframe name="iframe" src="http://www.example.com" />
Javascript:
link
<iframe id="iframe" src="http://www.example.com" />