I'm running a SvelteKit project. A link on my homepage references a page section by hash / id on an other page. When I click the link (CSR) the specific page is opened at the wrong scroll position. When I refresh the page or copy / past the url (SSR) the page position scrolls to the referenced page section.
Homepage:
<a href="/detailpage#section-name">
Detailpage:
<section id="section-name">
What can be the reason for the wrong scroll position with client side rendering in SvelteKit?
Related
I have a news section on a page, when i click on a news a fancybox iframe is opened showing the news page.
The news page contains 3 images on top ad some text on the body of the page, and on page load i create a new Swiper slider with the images.
Unfortunately on iOS Safari, creating the slider with those images make the content of the iframe being incorrectly sized.
This behaviour only happens on iOS Safari because if i test in chrome with device toolbar enabled everything works as expected.
I've attached a video of the issue at this link
First, fancybox works fine. The script attaches load event to iframe element and then (inside that event) reads width/height of body element and uses these values to resize iframe parent element so that iframe dimensions matches page size.
If you (or some 3rd party script) change layout, then, obviously, page dimensions will change, too. In that case, you can execute parent.jQuery.fancybox.getInstance().update(); (from within iframed page) to call update method that will do resizing again.
I have a page hosted on, say, www.domainX.com. In my page there is an iframe, src attribute of which is set to www.domainY.com (so it's on another domain). There are some links on the page served from www.domainY.com (so they show up in the iframe). When I click one of these links there happens the navigation inside the iframe. Now, when I move the cursor on iframe, right-click and select 'Back' on the appearing menu, it makes a back in the inner iframe. If I do the same thing again, it does a back on the main window, as if I pressed the back button of the browser (or I right-clicked out of the iframe and selected 'Back').
My problem is: I am OK with back navigations in the iframe, but I do not want them to bubble up to the main window. I can alter the source code of the page on www.domainX.com, but I don't have access to the source code of the page on www.domainY.com . I tried attaching an 'onback' handler on the iframe element, which stops the event propagation; but it did not work. Any pointers will be appreciated.
Thanks
I am trying to get a widget that is inside an iframe to install as a facebook page tab. The way it is set up now is the user can customize the widget, then when they have done that a button appears that directs them to the "Add Page Tab" page. The widget url for the widget they have customized is added to the end of the url so:
https://www.facebook.com/dialog/pagetab?app_id=MY_APP_ID&next=CUSTOMIZED_WIDGET_URL
The problem I am running into is this: Once the user clicks to "Add Page Tab", it just goes to that widget url and not to the page tab with the url contents displayed inside that iframe. A page tab is added to the test page I have but it does not display what I want it to and I will get to that later. I have looked at some other widgets that do what I want and they redirect from that "Add Page Tab" page to the actual page tab with their customized widget in the iframe there.
I am also unsure of what I should have the Page Tab url set to in my app settings considering that the url for the widget will change from user to user. If I set the Page Tab to a specific url, it of course shows that url in the iframe after I have done the "Add Page Tab" and doesn't show my widget.
I have tried looking for a tutorial on this but I can't seem to find any. Please let me know if I need to clarify any of this. Any suggestions are greatly appreciated.
Can anybody guide about how
does the new FB timeline incorporate the iframe for its pages.
Or is there any new stuffs coming in to replace these stufs?
The way you create and display your iFrame will be the same, except for a size change.
The new iFrame will be 810px wide, instead of 520px - existing tabs (apps) that are set to 520px will just be centered on the page, so they aren't "broken." Giving us 290 extra pixels is great!
You can no longer set a tab as "default landing page". Instead, users always see the main Timeline view and have to actively click through to custom apps.
To edit which apps you display, click the drop-down icon to the right of the tiles, click the ‘+’ button to import your custom apps, and then hover over them and click the pencil to swap them around.
If you have a contest or something on a tab which you would have wanted set as the "default landing page", you can create a post on your page which has a few sentences advertising such, with a link to the tab. You can then "pin" this post to the top of your page, so it will be the first thing users read. "Pinning" and "starring" on your Page act exactly like they do on your personal timeline.
Here's a good explanation of all changes
I have a facebook app which has 4 pages. When i try to click on the link it just refreshes the page and shows a blank page. If i click on the link and open in a new tab it works fine opens the other page properly. What might be wrong?
I had to just add target="_top" in the anchor tag to solve the blank page issue.