I am using this code:
<div class="infobox-pair">
<div class="ibp-left">
<iframe width="105" height="350" frameborder="0" scrolling="no" style="width: 311px; height: 105px;" marginwidth="0" marginheight="0" name="infobox_flight" id="ibp-left-iframe" src="http://mywebpage.com/paris"></iframe>
</div>
<div class="ibp-right">
<iframe width="105" height="350" frameborder="0" scrolling="no" style="width: 311px; height: 105px;" marginwidth="0" marginheight="0" name="infobox_package" id="ibp-right-iframe" src="http://mywebpage.com/lisbonne"></iframe>
</div>
That is displaying into the same div two different iframes. When I display the page whatever the browser it happens that I can get the same content for both the iframes even if looking at the source code the iframe are still different (based on their src and id).
It doesn't happen 100% of the time, I have to refresh sometimes several times to see it.
Do you have any clue ?
Thanks in advance
One thing to keep in mind, when you refresh in IE and some other browsers, the browser will retain the "current" src="" value for iframe, so if you navigated around a bit in the iframes, then hit F5, the current last navigated path for each iframe is still in the iframes. Is it possible you navigated to the same page somehow?
The only reliable way to get the iframes to "Reset" back to their initial src values on a refresh(f5) is to use javascript to set their src as a part of the page load event. I recommend setting the initial src in markup to just "about:blank" and alwyas programatically change it.
This has been a long time answered but have some additional info that might help web developers.
If you have loaded iFrame 1 in the browser before, then the newly added iFrame 2 will show the same content, even after refreshing multiple times. Try hitting Ctrl + F5, or clearing your temp files in browser, this can reset the iFrame src to it's correct value.
Related
Using simple HTML code, no JavaScript, nothing fancy, I use this HREF
Click here
Clicking on the link in IE, FireFox, Edge does open a new tab for https://www.example.com on click. In Chrome (version 79), the click just redisplays the current page.
This happens on Chrome desktop and phone (Android). There are no add-ins to my installation of Chrome; no popup or ad blocking installed.
Why doesn't Chrome open a new tab when target="_blank" is used? Thanks.
Added
The issue seems to be with an HREF being inside a FORM element. The FORM element is as follows:
<form action='' method='post'>
An HREF with target="_blank" outside the FORM element works properly. Just not inside the FORM element.
But still puzzled as to why that would be the case...and for a workaround or solution.
Added more - plus code
There's a button inside the form, and the button contains an image, and the link in the button will not open up a new tab.
Simple form with the button
<form action='' method='post'>
<p>inside the form</p>
<p><button><img src="https://via.placeholder.com/150 " width="24" height="24" class='button_img' alt='delete' /> that's a button</button></p>
<p><button>that's a button </button></p>
</form>
So, with even further testing, the click to open a new tab won't work in Chrome when the HREF is wrapped around an button with an image inside a form. But works in FireFox and Edge.
Why?
There are four image/buttons inside the form. The fourth one is the HREF/blank. Items 1-2-3 are form submittals; values need to be passed to the form processing page. The 4th item doesn't need to be processed by the form, but it is inside the form so that all four items will be on the same line. If I place the 4th (HREF/blank) outside of the form, then the 4th item is wrapped around to the next line.
a
The <button> tag cannot be opened in a new tab the same way an <a> does.
You can use this instead:
<p>
<button onClick="window.open('https://www.bklnk.com/B004RVZRL0');">
<img src="https://via.placeholder.com/150 " width="24" height="24" class='button_img' alt='delete' />
that's a button
</button>
</p>
I asked this question in a Wordpress forum with no response. So trying here in hope of an answer or suggestion.
I'm using the Wordpress Twenty Seventeen theme (here) and the multi-panel homepage. My menu is a series of "custom links" which navigate to anchors in each of the homepage panel sections.
The navigation to the anchors is not consistent. Some land where they are supposed to, and others land after the intended location. When I inspect the page code, the only difference in the panel sections is where 'tabindex' gets set.
The ones that work show tabindex set at ‘panel-content’ level:
<div class="panel-content" id="noted" tabindex="-1">
<div class="wrap">
<div class="entry-content">
<p><a name="noted"></a> </p>
<h2>Noted</h2>
The ones that land incorrectly have tabindex set in the “a” anchor link.
<div class="panel-content" id="video">
<div class="wrap">
<div class="entry-content">
<p><a name="video" tabindex="-1"></a></p>
<h2>A Video is Worth a Thousand Words</h2>`
It seems random from panel section to panel section. I didn't do anything differently when creating the page. I have never dealt with tabindex before.
Any suggestion on how to correct this, so the anchors land where intended?
Thanks in advance, Mike
This issue is resolved. Turned out to be a Wordpress plugin issue.
https://wordpress.org/support/topic/tabindex-for-home-homepage-panels/#post-10781852
Background
I have a basic HTML page with an iframe that points to a page with a SilverLight object on it. When the Silverlight object extends past the predefined height, the vertical scroll bar is displayed but in an inactive state. Below is my HTML and screen shots of the iframe.
Question
Is it possible to have a vertical scroll bar in an iframe when the target page contains a Silverlight object?
Code
<html>
<body>
<form>
<div>
<IFRAME height="300" width="1000" name="MyFrame" scrolling="yes"
src="http://mycompany.com/mysilverlightpage.aspx">
</IFRAME>
</div>
</form>
</body>
</html>
Screen Shots
This issue had nothing to do with Silverlight but with the SharePoint masterpage hosting the web part that hosted the Silverlight object. To allow the vertical scroll in this case the following changes need to be made to the masterpage. I created a custom masterpage based off for my business needs so I didn't have to worry about these mods wrecking the rest of my environment.
Remove scroll="no" from the body tag
Remove the two divs surrounding the "PlaceHolderMain" ContentPlaceHolder
<div ID="s4-workspace" class="s4-nosetwidth">
<div ID="s4-bodyContainer">
<asp:ContentPlaceHolder id="PlaceHolderMain" runat="server"/>
</div>
</div>
I have been able to ge the "like" button to appear on my home page, but cannot get it to show up on ALL my pages on the site. I have tried copying & pasting this code:
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode('http://'.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']) ?>&layout=standard&show_faces=true&width=450&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px"></iframe>
I found this code here:
http://www.greenlabeldesign.com.au/2010/04/inserting-the-facebook-like-feature-on-your-website/
Any suggestions on how to implement this feature?
My web site is www.connieskids.com
You need to include facebooks javascript file on all pages:
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
I have a homepage on an Intranet. It has at 15+ webparts (news, weather, etc.) I want to allow the users to customize the page by moving the webparts around or deleting them. At present I don't let them see the ribbon at the top so they don't have access to the "Edit page" button. I have pulled it out from the Ribbon
<a unselectable="on" href="javascript:;" onclick="return false;" class="ms-cui-ctl-large" aria-describedby="Ribbon.WebPartPage.Edit.Edit.Menu.Actions.Edit_ToolTip" mscui:controltype="Button" role="button" style="height: auto;" id="Ribbon.WebPartPage.Edit.Edit-SelectedItem">
<span unselectable="on" class="ms-cui-ctl-largeIconContainer">
<span unselectable="on" class=" ms-cui-img-32by32 ms-cui-img-cont-float">
<img unselectable="on" alt="" src="/_layouts/1033/images/formatmap32x32.png" style="top: -160px; left: -96px;">
</span>
</span>
<span unselectable="on" class="ms-cui-ctl-largelabel" style="height: auto;">Edit<span unselectable="on">
</span>Page</span>
</a>
Unfortunately it is not working. Any thoughts?
I will be doing the same with the "Stop Editing" button as well.
According to this post: http://artykul8.com/2011/03/useful-sharepoint-shortcuts/
the trick is to use the MSOLayout_ToggleLayoutMode(); javascript function.
According to a comment in that same page, in SP2010, that javascript function is only available when you already have a web part in the page. The behavior I observed differs from this one, given that, to me, this function only worked when the page was in edit mode already (and it worked even when the page had no web part added).
I was able to find the javascript file where that function is defined, which is the ie55up.js. You can load it in your masterpage by doing:
<SharePoint:ScriptLink language="javascript" name="ie55up.js" OnDemand="false" runat="server" />
For information about how to build a web control that uses that javascript function, see here: http://www.codeproject.com/KB/sharepoint/SwitchWPMode.aspx
Hope this helps
I finally found the answer to this question. It was very simple after the JS call was determined. I believe this should be for a webpart only page.
To put the page in edit mode for Personalization via a Javascript call:
ChangeLayoutMode(true); // how simple is that??
To stop the editing of the page via a Javascript call:
MSOLayout_ToggleLayoutMode(); // same as given in the other post
The "Stop" edit mode I believe is the same for all pages no matter if it's a personalized page, all webparts page, etc.