I am working on a project where I am simply loading same directory content into an iFrame. No external pages.
I have Colorbox within the iFrame content which is working beautifully.
My question is: I have some "parent" buttons which I would like to make them close any of the iFrame Colorbox popups. The project is an "information point" system with some buttons in the parent that show at all times, but whenever I click the buttons the iFrame Colorbox stays open.
A lot of the pages I have found talk from the opposite way, controlling the parent from within a Colorbox iFrame...
I'm going to guess that this may not be achievable from a security point of view...
many thanks everyone :)
You might be able to do something like this:
$('.cboxIframe')[0].contentWindow().$.colorbox.close();
I ended up using jQuery the other way round so the child controls the parent and hides the parent controls and when the ColorBox control is closed it "shows" the parent controls.
Related
This is a duplicate question of Disable all scrolling in an iframe, but allow clicking but I'm going to risk asking it again because that question was asked in 2014 and no solution was found (except that it can't be done). I'm desperately trying to find out if this can be done now. Therefore I would like to post this question again:
I'm trying to disable all forms of scrolling in my iframe, but still allow the user to click a button that appears in the iframe. I've successfully disabled all forms of scrolling (scroll bars, mouse wheel, etc) by using scrolling="no" and style="pointer-events: none;", however the later disables all forms of clicking to. Is it possible to prevent all forms of scrolling while still allowing the use to click within the iframe to inter-act with a button?
Unfortunately I don't have control over the iframe's content.
Possibly there is a way how to do this now after so many years? If so, I'd be very happy to hear about it. I checked all kinds of similar question of clicking and scrolling iframes but I did not find a solution yet.
Hmm... Honestly, I've never tried that.
But I imagine you could put a div over the suface of the iframe (as if it was a transparent overlay), and then when the user clicks the invisible div (that is on the iframe) then triggering a click event on the iframe?
If you happen to need the click's coordinates then make sure the div has got the exact same dimensions of the iframe (but with less z-index, so you make sure it's ON it) and then pass the div's click event coords to the iframe's click event you are gonna trigger.
Let me know if this works!
Regards.
I want to position my Extension Lib Dialog control to another than it´s default position, which seems to center to the window or the parent element. I have seen that there is a resize-listener, maybe this could be overwritten.
I tried to position it directly in the style-class, no success:
<xe:dialog id="loginDialog">
<xe:this.style><![CDATA[#{javascript:return "top:100px !important; left:50px !important;";}]]></xe:this.style>
<xp:div>
<xp:label value="Label" id="label1"></xp:label>
</xp:div>
</xe:dialog>
Seems that no one else has this problem ?? I could not find any topics or posts on this.
Are you sure you want a dialog? You might want to check out the ToolTip and Tooltip dialog controls. That's likely what you want instead of trying to mess with the main dialog.
The Ext. Library comes with a sample application. There should be code examples in there. Suggest you take a look at this page once you get it installed : /XPagesExt.nsf/Core_InPlaceDialog.xsp
If you must mess with the dialog itself - search for ways to do this with a standard dojo dialog. Since that's where the XPages one comes from. Maybe start here : How to set the location a Dojo Dialog opens at?
I have a web page, and when I am zooming, all the elements that are there in the page move.
How do I modify my CSS file in order to fix this issue?
When you zoom the page using: CTRL+ OR CTRL- your browser is changing the layout of your page.
The is no way in JS to capture this zoom event , the only thing you can do it to catch the resize event and "fix" your page layout there.
On my website, I have a list of users. By clicking each one, a fancybox pop up window will show. Within the window, I use iframe to load a page with paintings from the user.
Is there any way to make the images in fancybox iframe pinable by clicking pinterest bookmark pin it button? Or do I have to add a pin it button to each HTML page?
Thanks,
Milo
The bookmarklet button works on the page that is currently loaded. Usually, if an iframe has changed even slightly from its original url, it is inaccessible to the parent page via javascript. The actual iframe itself has to initiate the appropriate messaging request systems.
If you can have the iframe send a message to the parent window that contains the desired images and then have the parent window add the image links to the page, that seems to be the only way to do it right now. Look into the postMessage() function.
As you asked if there is "any way" to do it, I would say yes. However, it is very ugly. Probably better to add pinit buttons to each image in the iframe. :)
i have a image menu within my asp.net website. i want to include an easy solution for hoverover functionality. for example, menu item one would dispay 1.jpg on page load and hover1.jpg when a user hovers their mouse over the image. thanks for any support.
You can do this easily via javascript :
http://www.webdevelopersnotes.com/tutorials/javascript/javascript_image_change_functions.php3