Basic question...is there a way to set a default setting for spread view in PDF.js viewer?
I want to be able to change the spread setting based on my layout, for example to 'no spreads' option but I can't find procedure for this in the official documentation or on the internet.
Ok, I managed to find the solution and it wasn't so hard after all.
For anyone struggling with this problem, you need to open viewer.js and change "spreadModeOnLoad" (-1 is for the last browsers (or PDF file's) default state, 0 is for no spreads and 1 is for obligatory spreads).
The part of the code is located here:
function getDefaultPreferences() {
if (!defaultPreferences) {
defaultPreferences = Promise.resolve({
"cursorToolOnLoad": 0,
"defaultZoomValue": "",
"disablePageLabels": false,
"enablePermissions": false,
"enablePrintAutoRotate": false,
"enableWebGL": false,
"externalLinkTarget": 0,
"historyUpdateUrl": false,
"ignoreDestinationZoom": false,
"pdfBugEnabled": false,
"renderer": "canvas",
"renderInteractiveForms": true,
"sidebarViewOnLoad": -1,
"scrollModeOnLoad": -1,
"spreadModeOnLoad": 1,
"textLayerMode": 1,
"useOnlyCssZoom": false,
"viewOnLoad": 0,
"disableAutoFetch": false,
"disableFontFace": false,
"disableRange": false,
"disableStream": false
});
}
return defaultPreferences;
}
Related
I'm needing some help with Swiper.js
I have a site I'm working on https://www.paradev.co.uk/ee-live/home-alt/ and what I want to happen is after the last slide the user can continue to scroll down to rest of the page and then on scrolling up the slider works again with the mousewheel.
I've had to add the 'slide Down' text and arrow to allow the jump to the next section. This isn't ideal and will get deleted once it's working correctly.
I've managed to get what I want by adding the function slideChangeTransitionEnd and disabling the mousweheel. This does what I want for scrolling down and past the container but I can't find a way to reverse it for scrolling back up.
var swiper = new Swiper(".mySwiper", {
direction: "vertical",
slidesPerView: 1,
direction: "vertical",
slidesPerView: 1,
speed: 1000,
spaceBetween: 0,
roundLengths: true,
centeredSlides: true,
mousewheel: {
forceToAxis: true,
sensitivity: 1,
releaseOnEdges: true,
},
mousewheel: true,
pagination: {
el: ".swiper-pagination",
clickable: false,
},
});
swiper.on('slideChangeTransitionEnd', function () {
swiper.mousewheel.disable();
});
Any ideas?
Thanks.
NOTE
The swiper is in a section with the ID of 'slider'
The section below has an ID of 'festivals'. If this offers an alternative way
I think, It's too rate to fix your issue.
I was dealing with same problem as you today.
But, finally I solved that problem.
try romove below option.
mousewheel: true,
and just leave below options.
"mousewheel: {
forceToAxis: true,
sensitivity: 1,
releaseOnEdges: true,
},"
That's how I handled the problem.
I hope it will be helpful.
Ramy's answer above worked for me, but just to add if you're using react you can add the params as below
<Swiper
className="mySwiper max-h-[400px] w-full max-w-[100vw] overflow-hidden "
direction={'vertical'}
slidesPerView={1}
spaceBetween={30}
mousewheel={{
forceToAxis: true,
sensitivity: 1,
releaseOnEdges: true,
}}
modules={[Mousewheel]}
>
I have a line on a chart with a marker (icon). Highcharts is hiding the icon based on some behavior I do not know about.
The code to add 'points' to my data series ('output') looks like (I know enabledThreshold is redundant, but had to try something) this:
output.push({
id: id,
data: points,
keys: ['x', 'y', 'marker'],
marker: { enabled: true, enabledThreshold: 0, },
color: 'transparent',
lineWidth: 1,
animation: false,
showInLegend: false,
enableMouseTracking: false,
});
Here is an image of the browser with the marker:
And this is what happens if I make the browser window just a little less wide:
The little red icon is gone (making the browser wider will bring it back). I want the icon there 100% of the time.
Thanks raf18seb, you nailed it. Unfortunately dataGrouping is enabled by default, so it is necessary to disabled it:
dataGrouping: {
enabled: false,
forced: false // not sure this is necessary but whatever
},
Generally I seem to have a lot of code over-riding highcharts default behaviors...
dataGrouping: {
enabled: true,
forced: true
}
imgur.com/oLD44Rm
dataGrouping: {
enabled: true,
forced: false
}
imgur.com/Mo0eE2O
Highcharts large data grupperom well if forced enabled. I found a gap where the data has a large gap. You can leave and forced to remove the gap?
UPDATE:
I found this: xAxis.ordinal: false, and series.dataGrouping.forced: true = gap.
http://jsfiddle.net/vj3kynqc/1/
I want to leave xAxis.ordinal: false :)
How to do it without gap the line?
I think the problem is transform property. Caniuse says safari on IOS have partial support, only with vendor prefix -webkit-, but in ows script i see a code for adding vendor prefixes, so i can't get the problem with this carousel.
initializing plugin code:
$(".owl-carousel-beer").owlCarousel({
items: 2,
nav: true,
center: true,
loop: true,
dots: false,
mouseDrag: true,
stagePadding: 50,
responsiveClass:true,
responsive:{
0:{
items:1,
stagePadding: 0,
},
480:{
items:1,
stagePadding: 0,
},
768:{
items:2,
},
1024:{
items:2,
},
1380:{
items:3,
},
1580:{
items:4,
}
}
});
On ipad owl carousel looks like this.
http://i.stack.imgur.com/Q6yET.jpg
On android it looks like this perfect carousel
http://i.stack.imgur.com/gvwdF.png
Bug was fixed by putting initialization code into script in the html page.
When the slideshow ends(when all the pictures displayed) it does not start over, gets stuck at the end.
Any help is appreciated.
Here is the code:
$(".flexslider").flexslider({
animation: "fade",
controlsContainer: ".flex-container",
useCSS: false,
touch: true,
controlNav: false,
animationLoop: false,
smoothHeight: true,
slideshowSpeed: 4500,
slideshow: true,
pauseOnHover: true
});
You need to change the folowing line:
animationLoop: false,
to
animationLoop: true,
Also make sure that you don't hover the slider as the folowing line of code in your example will make it pause on hover (mouse over):
pauseOnHover: true
Try to use reverse: true for starting back to 1