Code working correctly only in incognito mode - wordpress

I created an owl carousel with many items in it. I use javascript fetch to get data and then i insert the data in this items. The problem is that this works only for the items that are displayed on the screen when the page loads. If i scroll to the next item which is hidden at first then the data are missing. The weird thing is that this doesn't happen if i open the website in incognito mode. Everything works perfect there. How is it possible for a code to work correctly only in incognito mode? The website is this https://bet-prognostika.com/ and the carousel is on top of the homepage. The season overall number and the number in front of new pick(s) are the ones that i insert using fetch.

Related

How to detect what cause empty/blank pages printed from web page

I'm working on printing product web page. Employ #media print {...} to customize components for proper appearance on print canvas. But one issue I even can't understand how to drill to the root of the problem. The issue is that 3 out of 5 total pages are blank. First two pages rendered with content and then three blank pages. Chrome print preview popup window just give result and I have no clue what component(s) responsible for "printing" blank pages.
I find how to use chrome devtool to emulate print canvas and drill down to trouble maker

Buttons become unclickable after certain actions - how to fix it?

1 – I have a search and filter form on my mobile site (480px and below) made with Search and Filter Pro plugin. Here’s the screenshot showing what I mean:
If you click on “Pokaż filtry” filters will appear. The problem is that when you expand it and just click “filtruj” (filter), the “Pokaż filtry” button will stop working – you can click as many times as you want but it won’t expand anymore (it becomes unclickable). Everything will start working again after refresh.
Second problem is very similar to the first one. At 480px and below, when you choose any option and click “filtruj” the whole search form will dissapear. Everything will start working fine again after refresh.
At resolution 960px to 480px there’s a button to show sidebar.
There’s also a Search and Filter form. When you use it, you can’t close the sidebar – the button just stops working (becomes unclickable).
These issues are 100% caused by Search and Filter Pro plugin. When I deactivate it, everything works fine. Most likely it's a conflict with theme.
Here's my site - http://gromocje.pl/
Does anyone have any idea how to fix it? I feel like I tried everything... I've never seen such a issue.
$('.otfm-sp__title').click(function() {
replace with:
$(document).on('click', '.otfm-sp__title', function() {
Reference & more info - stackoverflow.com/a/29674985/2245806

Website doesn't load portfolio content on mobile

I just made a website using a Wordpress theme and it all works good on desktop computers. However, while the site initially loads normally on my phone (I'm using iPhone 6 with iOS9, but the problem is the same on Android phones too, I tried two), once I click on the portfolio item, it loads a blank page (header and footer only).
When I tap on the address bar, I notice that it never went to the right link at first place (the portfolio item link), it just shows the homepage link and there is no content.
I managed to fix the problem by entering the external URL in portfolio item options. It was still internal link from the site but I made the link open the new tab (if it doesn't open new tab, the problem stays the same). However, if I choose to go back to the homepage from that link (the portfolio item link), the homepage is blank, there is only header and footer so the problem returns again.
Just so you know, the first portfolio item contains the external link outside the Wordpress and that one opens normally.
What is wrong with the mobile site?
The site URL is: http://svenharambasic.com
The screenshot is attached. Thank you!
P.S. There are also google ads showing, I never encountered that before, but I'll work on that once this is solved.
I only see a white screen upon clicking any of the homepage portfolio image links (except for the first link which goes to an external site in a new tab) on desktop and on mobile actually. There is a content_inner class with inline styling setting visibility:hidden.
It's unclear to me why it's doing that- maybe to remove focus from the body and draw focus towards something that is supposed to appear in the foreground but does not? If I remove visibility:hidden from the element in the browser, I see a series of additional images appear, which seems to me to be more an expected behavior. Are we on the right track?
I managed to solve this, it was the setting in the theme options; I had to disable grid lines... I can't say I truly understand why, but it worked!

Image size shifts when page loads

I have a ghost-in-the-machine it seems: I have put a thumbnail with a rollover stage on a Wordpress site I'm working on. It works fine except that it does this strange resizing when the page loads. A small but very annoying thing.
This is the page
I've also added the same code to another Wordpress site I am working on, which is based on the same theme (Quark). It doesn't happen on the other site.
How do I resolve this?
You are using percentages to define the widths of the containers and images, which is fine. However, upon initial page load, not all of your elements are available yet, so the relative percentages gradually reach their end-point when the document finishes loading. Doesn't look like like it's doing too much on my screen but in order to get around this you can load the images via jquery and set it to $(document).ready which will wait until the page is done loading, to even load the iamges.

Back button loop with IFRAMES

In my (school) website we use Iframes to display class blogs (on blogger). This works well EXCEPT if the user then clicks on (say) a photo inside the iframe. Blogger (in this case) then displays the photo in the whole browser window and the back button loops; that is if the back button is hit, the browser (IE, FF, Chrome) stays on the same page. The only way out is for the user to jump back two pages (which many of our users don't know how to do).
I've read a lot of posts on back buttons and iframes and there doesn't appear to be a simple solution. Bear in mind that I don't have control over the iframe content (so no embedded back buttons in the frame are possible). Ideas anyone?
The solution I would use would be to loop through the iframe content after it has been loaded and set target attributes on links in the iframe so that they open in either the iframe, or in a new window. Here's an example using jQuery:
$('#iframeID').contents().find('a').attr('target', '_blank');
You could do something similar using a loop and DOM methods, I'll post some code to do that if your not sure how to go about it.
EDIT: can't access the content if its cross domain, so this wouldn't work in this case

Resources