• Registrieren
  • Anmelden
  • Preise
  • Hilfe
    • Hilfe
    • Tutorials
    • Blog
    • Handbuch
    • Support Forum
  • Benachrichtigungseinstellungen Benachrichtigungseinstellungen
  • Forenübersicht
  • Bugs

Mobile embed: requirement to login appears in the middle

Gestartet 10.05.2019 von Paulius Bakutis

Paulius Bakutis

10.05.2019

We use picture voting and in mobile version embed it extends in a high column. When I press the vote, the login screen jumps to the middle, covering the voting options and it's not seen. The only way to see it is to scroll to the middle of embeded voting screen. Check this: https://www.visitbirstonas.lt/index.php?module=editable&action=separated&id=422

Markus Huber

10.05.2019

Hi Paulius!
We'll look into it and get back to you!

Markus Huber

08.06.2019

Hi Paulius!

Sorry it took a little longer. Since some of our users integrate our polls screen filling, we couldn't easily rebuild it.

But now there is the option to deactivate the centered overlay. The iFrame will then automatically be resized to the size of the overlay. This requires the iFrameResize() Script.

You need to add &embed_options[disable_remote_overlay]=1 to your poll link.
Take a look at: https://pollunit.com/tutorials/embed_poll (Almost at the end of the tutorial)

When the iframe will be loaded you can bind functions on this event. For example you could do something like this with jQuery to scroll your page to the iframe when the iFrame contents change.

$('iframe').load(function() {
  $('html, body').animate({ scrollTop: ($('iframe').offset().top) }, 'slow');
});

Another solution would be to set the height of the iFrame to 100vh. vh units representing a percentage of the current viewport height. By setting the iFrame via css to 100vh the iframe always fit to the users display. As stated before, many of our clients use embedded polls screen filling. The CSS would look like this:

iframe {
  width: 100vw;
  height: 100vh;
}

Your page has a fixed header. So you could also substract the header height from the 100vh.

iframe {
  width: 100vw;
  height: 100vh;
  height: calc(100vh - *YourPersonalHeaderHeightInPx*);
}

I hope this will help you!

Werkzeuge

  • Abstimmungen
  • Umfragen
  • Freie Tabellen
  • Ideen und Feedback sammeln
  • Fotowettbewerbe
  • Videowettbewerbe
  • Musikwettbewerbe
  • Landingpage
  • Paarweiser Vergleich
  • Adventskalender

Hilfe

  • Support
  • PollUnit Hilfe
  • Tutorials
  • Support Forum
  • support@pollunit.com

Tutorials

  • Erstelle Deine erste Umfrage
  • Erweiterte Umfrage-Funktionen
  • Erweiterte Verzweigungslogik für Umfragen
  • Aufgaben online verteilen
  • Stimmen abgeben und Optionen bewerten
  • Finde einen Termin
  • Über Bilder abstimmen
  • Erstelle Dein eigenes Theme
  • Umfragen mit eigenem Logo
  • PollUnit Auswerten
  • Dot-Voting
  • Bewertungswahl
  • Abstimmungen auf der eigenen Webseite
  • Live Voting
  • Konsens finden
  • Orga­nisationen verwalten
  • Mehrfachteilnahmen verhindern
  • Spenden und Teilnahmegebühren

Legal

  • Datenschutzerklärung
  • Nutzungsbedingungen
  • Impressum

PollUnit

  • PollUnit Blog
  • Über PollUnit
  • Pressekit
  • © PollUnit
  • Registrieren
  • Anmelden
  • Preise
  • Hilfe
    • Hilfe
    • Tutorials
    • Blog
    • Handbuch
    • Support Forum