Unable to center align PDF file embedded in iFrame embed widget.

AgilityAssoc.Canada

Asked on May 24, 2017 at 11:33 AM

I have two forms that are actually used to display pdf documents. One for French and one English.

The English one (70396857479981) displays the pdf file nicely centered the French one (70395753999982) is slightly shifted right. See images below. I have these two embedded at site using

I tried cloning the English one and used the French pdf file and it still is off center.

ENGLISH

FRENCH

I have attempted to resolve the problem with some custom css, pdf file settings, widget settings, without any success.

Can you please advise as to what is required.

Thank you,

Regards Robert

http://www.aac.ca/en/rules/inc/AAC_Rulebook-v6.html

http://www.aac.ca/fr/reglements/inc/AAC_Rulebook-v6.html
Ashwin JotForm Support

Replied on May 24, 2017 at 1:55 PM

Hello Robert,

I did try to open the English version of webpage but it shows 404 not found error. Please check the screenshot below:

Since I am unable to compare both the pages, when I see the French version of webpage, it seems do display the PDF correctly. Please check the screenshot below:

Do you see any alignment issue in the screenshot above?

We will wait for your response.

Thank you!
AgilityAssoc.Canada

Replied on May 24, 2017 at 9:23 PM

Well that is so strange... I do not get the screen shot you show for the French file.

here is the url for the English one again.

http://www.aac.ca/en/rules/inc/AAC_Rulebook-v6.html

Here are my screen shots. Note the French one. I'm using Chrome.

I also see the same thing when in form builder.

As I said above I'm using Chrome, just noticed If I use Microsoft Edge or Firefox they both appear centered as they should and you show.

Must be the browser?

Thanks, Robert
Chriistian Jotform Support

Replied on May 24, 2017 at 11:53 PM

I checked the links you have provided:

http://www.aac.ca/en/rules/inc/AAC_Rulebook-v6.html

http://www.aac.ca/fr/reglements/inc/AAC_Rulebook-v6.html

In Chrome Browser, here's how it appear on my end:

English

Frech

Are you still experiencing the issue on your end? May we know which device and version you have encountered this problem?

If the issue still persists, please let us know.
Regards.
AgilityAssoc.Canada

Replied on May 25, 2017 at 9:39 AM

I am using the latest version, 58.0.3029.110 (64bit)

OS Win-10 Pro.

When I first view the French version it starts centered and after a few milliseconds jumps right.

I made some adjustments in the settings the problem persist, weather editing or viewing.

If I connect incognito, it works just fine, it is all centered when editing and the site view.

Can you explain why this is happening?

Best regards,

Robert

One other thing, perhaps a new thread:

iFrame embed widget settings

When I was working on it yesterday I used console and found some JavaScript in a html file that sets width and height of the iframe. I was trying to set my own width and height in the iframe with custom css, So which has the priority? Would using !IMPORTANT over ride the java script?

widgets.jotform.io

    (function(ready) {
      ready(function() {
        JFCustomWidget.subscribe("ready", function(data) {
          var params = JFCustomWidget.getWidgetSettings();
          if (params.url) {
            var transparent = ('transparent' in params && params.transparent === 'Yes') ? 'true' : 'false';
            var iframe = document.createElement('iframe');
            iframe.setAttribute('src', params.url);
            iframe.setAttribute('allowtransparency', transparent);
            iframe.setAttribute('frameborder', '0');
            iframe.style.border = 'none';
            iframe.style.margin = 0;
            iframe.style.width = (data.viewWidth || 560) + 'px';
            iframe.style.height = (data.viewHeight || 400) + 'px';
            document.body.appendChild(iframe);
          }
        });
      });
Chriistian Jotform Support

Replied on May 25, 2017 at 10:57 AM

Hi,

If it works correctly in Incognito mode, then your regular browser (non-Incognito mode) might have stored the older version and is rendering it to you. Have you tried clearing your browser cache?

Regards.
AgilityAssoc.Canada

Replied on May 26, 2017 at 5:44 PM

Hi,

I cleared the cache and it works OK now.

I find this very annoying, happens frequently. I will change my settings.

I have a second question above about the javascript that manages the Widget iframe.

Should it be posted as a new thread?

Thank you for all the help,

Robert
Mike_G JotForm Support

Replied on May 26, 2017 at 6:37 PM

We are glad to know that the issue you initially posted in this thread now works. We, again, would like to apologize for any inconvenience.

With regards to your other concern, I have moved it to a new thread considering it is a different topic and to avoid confusion with the answer that will be provided.

https://www.jotform.com/answers/1156090

Thank you.
AgilityAssoc.Canada

Replied on May 28, 2017 at 9:13 AM

Hi,

No apologize is required. Your help is much appreciated.

Regards, Robert