I have a small iframe on my page. Whe a user clicks a link within that iframe, the content opens in a magnific-popup. But, the popup is only loading within the iframe, not the either page. How would I get the popup to open in the center of the parent (whole page)? I tried adding target="_parent" and target="_top" to the but they didn't work.
Related
My /htmx webpage has a list of links like this one:
<li class="collection-item" hx-push-url="true" hx-post="/htmx/file/open/specification.idp"
hx-trigger="click" hx-target="#screen">Click me</li>
When I click it, the #screen target is correctly updated, and the browser URL is correctly changed to /htmx/file/open/specification.idp (thanks to hx-push-url="true").
When I click the browser back button, the original htmx page is properly displayed, but the browser URL remains /htmx/file/open/specification.idp, instead of becoming /htmx.
How can I get the browser URL to be /htmx? I'm using Htmx 1.8.0. I also tried using hx-get.
For example, I have a blog website, with a discover page that doesn't take any params. When you load page fetch hook calls API that randomly returns some article.
So my problem is when I'm already on the Discover page and I click discover in the Left bar I want the page to refresh.
:key="$route.fullPath" is not working for me because nothing is changing in the path.
Hi I am working on application built in vue. I have observed that whenever we route to new vue page from homepage(app page) using route, the contents of homepage are still visible in the next page such as heading i.e: new page loads with previous headings from homepage still visible. I want to completely open new vue page so that only contents of that page are visible(not the homepage or app page).please see below image for example
In above pics your can see that black header is common in every page. I want to open completely new page so that previous content don't show
It was done by hiding the div which contains the contents of the homepage and displaying the div which contains the contents of the desired page. I used below code to hide or show the div
document.getElementById("id").style="display:none;" // if I want to hide a div
document.getElementById("id").style="display:block;" // if I want to show a div
I'm using colorbox to load an external page in an iframe. As the page is loading you can see the loading GIF. All is good so far :)
Once the page is loaded, there is a form with a submit button. When I click the button, it loads a second page in to the same iframe. This all works fine, except it doesn't show the loading GIF while the second external page is loading.
Is there a way I can get this to show when I click the submit button, then once the page has loaded hide it again?
The reason for the difference in the behavior is this: the first load of the iframe is accomplished by ColorBox, which includes code to display the spinner. The second event is triggered by (I assume) your submit button so the ColorBox plugin isn't called.
This isn't strictly a ColorBox question, BTW, but I suggest you study the plug-in's code to see if you can reuse the technique that displays the spinner. Just a thought.
In any case, you'll likely need some javascript to handle the spinner display and event timings.
I use colorbox plugin in my iframe. I would like to open it in parent window when i click a button. But the problem is that it opens in iframe's window. I couldn't find any solution yet. How can i solve this problem?
Assuming these are on the same domain, you can use the parent object in the iframe to open a colorbox in the parent window. (Something like parent.$('#id').colorbox() should work.)
If your iframe is on a different domain, I'm pretty sure you're out of luck due to cross-domain policy restrictions.