Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Slides get jumbled #6

Open
Wolfr opened this issue Aug 11, 2018 · 7 comments

Comments

Projects
None yet
2 participants
@Wolfr
Copy link
Owner

commented Aug 11, 2018

When you extract a presentation, sometimes the slides get jumbled.

It's unclear when this starts to happen, but it's usually when the presentation gets a bit more complex.

In this issue I will log more details and a workaround.

@Wolfr

This comment has been minimized.

Copy link
Owner Author

commented Aug 11, 2018

Keynote Extractor user Roel Van Gils found a workaround to fix said bug with a piece of jQuery.

The bug should obviously be fixed in the source code, but you can apply this code to the output to fix it. Then you should resave the generated HTML.

$(function() {
  $('img').each(function(index) {
    var img = this;
    var order = (index+1).toString().padStart(3, "0");
    img.src="image/image."+order+".jpg";
    img.srcset="images/images."+order+"-hg.jpg 1200w, images/images."+order+"-lg.jpg 984w, images/images."+order+"-md.jpg 728w, images/images."+order+"-sm.jpg 375w";
  })
});

The trick is that in the generated HTML the image sources are wrong, but the images in the /images folder do have the right order.

@BillTribble

This comment has been minimized.

Copy link

commented Apr 7, 2019

For anyone trying to suss this out - I got it working by:

  1. exporting as 'responsive' and opening in Chrome
  2. running this TWICE in the console: https://blog.wplauncher.com/run-jquery-in-chrome-console/
  3. running the above code
@BillTribble

This comment has been minimized.

Copy link

commented Apr 7, 2019

Only trouble is, Chrome wouldn't let me save the altered code. Any way I can do this?

@Wolfr

This comment has been minimized.

Copy link
Owner Author

commented Apr 7, 2019

You can take the index.html of your exported slides, add a reference to jQuery (on a CDN or local) in the head section, then run the code, then copy the changed source. It is a hassle but I've done that and it works.

@BillTribble

This comment has been minimized.

Copy link

commented Apr 7, 2019

@BillTribble

This comment has been minimized.

Copy link

commented Apr 7, 2019

(when I 'inspect source' in Chrome, it doesn't show the fixed version)

@BillTribble

This comment has been minimized.

Copy link

commented Apr 7, 2019

No worries - got it by copying code from Inspector!
Many thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.