I have this window that it is supposed to route to other elements on the same page, but whenever you click on one of the three links, the browser reach the tag, but the window doesn't close, you need to click on the (x) to close it. I am a NodeJS dev, this is the first time I fight againts Wordpress. The X uses some lottie function that I can't reach on the window content.
Related
So the console preview panel at the bottom of the page remembers how big you had it last time you previewed. Usually this is great! But somehow mine is currently maximized, so the only thing that shows up is the Page dropdown at the top of the page (and anything in the console, if I switch between pages and the pages have things that log on load). The rest is just white console. Any idea how to get back the default view where the console is 20% of the bottom of the page? There is no visible dragging bar frame thing anywhere.
I can change my preview to console=0 to be able to use it, but I'd like a way to restore the default position of the panel.
Normally you should be able to hover on the top border of the console panel and resize it as you wish. An icon will appear, similar as in the image below:
Nonetheless, if you are doing your previews on a mobile device such as a tablet, then such thing is not possible to do. Therefore; a hacky way to do it would be to put the following code on the onAttach event handler of the page that is loading:
var splitPanel = widget.root.getElement().parentElement
.parentElement.parentElement.parentElement
.parentElement.parentElement.children[0].children[3];
splitPanel.style.height = "75px";
Nota bene: this is intended to ONLY work in preview
I have a page which contains an iframe. The iframe can take user's input (via button click or menu selection) and display content accordingly.
What I need is, when a user manipulates the iframe, the browser push each set of iframe parameters into history; and when the user click at back button, the iframe will reload its content using the saved parameters from the previous history entry. I have a piece of code doing the reloading as shown below.
The strange thing is, when I make multiple settings on the iframe (hence multiple state entries added to history), and then click at back, it'll work like this,
Say that I have state 4, 3, 2 in history and I'm now at state 5
the first click restore to state 4 (the "----state changed----" logging message is printed
the second click reloads the iframe with default content. The "----state changed----" is not printed; the reloading code is not called.
the third click restore to state 3
the fourth click is like the 2nd click
the 5th click restore to state 2
So after each click that successfully restore the state, it takes two clicks to trigger the popstate event (I tried statechanged event, too, with same result) and restore to another previous state.
Anyone know what's going on here? Thanks in advance.
History.Adapter.bind(window, "popstate",
function (event) {
console.log("----state changed------", History.getState());
console.log("----state data------",History.getState().data.state);
//code to do reload an iframe to its proper state
});
So I stumbled on this same issue. The situation we had was using history.pushState() to update the URL and then after that changing the src attribute of an <iframe>. By changing the src of the <iframe>, we are implicitly telling the browser to add to its history that the iframe had changed. Thus...
When we pressed back the first time, window.history's popstate is
triggered on the <iframe>'s src attribute and is reverted back to it's previous state.
Pressing back a second time triggers the popstate event for the state you originally pushed onto the stack
Our solution involved that when we decided to update the URL and push the state onto the stack, when we wanted to update the <iframe>, we used jQuery to replace the <iframe> list so...
$("#iFrameID").replaceWith(('<iframe id="iFrameID" src="' + location + '"></iframe>'
By doing this, we removed the side effect of the browser history getting polluted with our update to the <iframe> tag.
I had the same problem.Instead of navigating the user to the previous page on the website, the back button navigated the user to the previous page inside the iframe. This code below will help you to solve your problem:
iframe.contentWindow.location.replace(href)
I am writing a simple (ASP.NET) web application for the iPad. It is written and works well however one feature is it serving up PDF files (among others). To do this I used window.open to open the file.
When this is done in Safari, it works perfectly. You click the button, the file opens in a new tab; you can then close the tab to return to the previous web page.
However now running the application in fullscreen mode - i.e. with the appropriate "meta names" set and from a shortcut on the home screen - when you click the button to load the file, it loads fullscreen with no means to get back to the last page.
Because it is a file, not a webpage, I can't put a "Back" button on, and when you press the iPad button it simply closes the whole thing.
I know this has been asked before and I have read a number of similar questions - the closest of which was this:
https://stackoverflow.com/questions/9168236/web-app-hyperlinks
If at all possible, it would be far preferable (thanks to the control library I am using) that the button click is done with javascript - it is not easy to set the link href.
The upshot is I really I just want to create a new window from within a fullscreen iPad web application, or allow the "back" navigation somehow...
Is this possible?
Thanks!
Create an iframe on your page rather than using an window.open and set that as the target.
That way your pdf would open within your existing window.
Use some client side javascript like jQuery to style it like a dialog window.
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 webhierarchicaldatagrid and its first column is a template column which is a hyperlink. So onmouseover on the data of that column I want a small popup window to be open right next to that data so that user can drag the mouse on that popup window. The window contains few links which on click will navigate to another page. I want to know how to get the popup window to be open right next to the data and also how to keep it open only when the mouse is on it. as soon as the mouse is not on the popup I want the popup to close.
qTip is a pretty popular jQuery plugin that can do what you are wanting. Here is the demo page for the type of functionality you are describing:
Demo Fixed tooltips on hover
Here is another link, with 30 popular tooltip plugins:
30 Stylish jQuery Tooltip Plugins For Catchy Designs