Page 1 of 2
Steel Gauges on a mobile
Posted: Tue 08 Jul 2014 5:38 pm
by The PIT
It works fairly well. However I need to move the popup graph location so they pop up centrally. If you got to
http://www.sheffieldweather.co.uk/Live%20Weather.htm on a mobile (not ipad) you'll see what I mean.
Can I fix this?
Re: Steel Gauges on a mobile
Posted: Fri 25 Jul 2014 8:28 pm
by mcrossley
The lines you need to change to alter the centring is...
Code: Select all
tooltipoffsets : [20, -30], //additional x and y offset from mouse cursor for tooltips
and
x = (x + tipw > $(document).scrollLeft() + $(window).width()) ? x - tipw - (ddimgtooltip.tooltipoffsets[0] * 2) : x;
I'd start by making the x offset 0 rather than 20, then changing "x - tipw - ..." to "x - 0 - ..."
I haven't tried it, so you may need to play around to find what works for you.
Re: Steel Gauges on a mobile
Posted: Fri 25 Jul 2014 8:53 pm
by ashreigney
just looked on my Blackberry and it looks fine
Re: Steel Gauges on a mobile
Posted: Mon 11 Jul 2016 8:49 am
by The PIT
Only finally got around to playing with this and changes the values didn't seem to have any effect. Any other ideas?
Re: Steel Gauges on a mobile
Posted: Mon 11 Jul 2016 10:39 am
by mcrossley
The script hasn't been changed? ... (
http://www.sheffieldweather.co.uk/cumul ... /gauges.js)
Code: Select all
tooltipoffsets : [20, -30], //additional x and y offset from mouse cursor for tooltips
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 6:15 am
by The PIT
That's because I put it back since it had no affect.
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 8:48 am
by mcrossley
In positiontooltip, change...
Code: Select all
// $tooltip.css({left: x, top: y});
to
$tooltip.css({left: Math.min(Math.max(x,0),$(window).width()-tipw), top:y})
Edit: there is something odd about your page, the browser debugger shows the page and code being loaded twice? If you online edit the wrong copy in memory it doesn't show on teh page.
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 10:52 am
by The PIT
how do you know it's loaded twice????
I've noticed the graphs have ceased today to update although they've been working until yesterday afternoon which is odd. The text updates but not the graphic.
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 11:10 am
by mcrossley
Load the dev tools in your browser (I use Chrome) - press f12 then reload the page.
Capture.PNG
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 4:11 pm
by The PIT
Could be a bug in chrome as it doesn't show that in firefox.
Basically the page uses an iframe and it's shared across ipad version and a mobile phone version. If you shrink the your browser you'll see it resize automatically.
Now I've got to find why the graphs aren't updating.
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 5:28 pm
by The PIT
Just checked the page in xara it's just an iframe which refers to guages htm file. It's not loaded twice. Code below.
<iframe src="
http://www.sheffieldweather.co.uk/cumulus/gauges-ss.htm"
width="100%" height="100%">
content if browser does not support
</iframe>
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 8:00 pm
by duke
Am I missing something? Marks gauges resize for me just fine on what ever screen size 'out of the box'. And why use an 'iframe'?
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 8:42 pm
by The PIT
Yup missed a point
The only way I can keep the website layout the same across the board. Looks a bit odd when one page has a completely different look.
Re: Steel Gauges on a mobile
Posted: Tue 19 Jul 2016 10:21 pm
by mcrossley
The PIT wrote:Could be a bug in chrome as it doesn't show that in firefox.
Firefox shows the same...
Capture.PNG
Can't figure out why though, could be a script pre-loading pages as it downloads the mobile page as well when you are running desktop.
Re: Steel Gauges on a mobile
Posted: Wed 20 Jul 2016 4:47 am
by The PIT
Well the only thing right now that I'm concerned about is the graphs not updating. Whats happening there???