1. rasputin007's Avatar

    Any thoughts?
    That could also partly due to the mixed scaling system Ian uses. If UniAW would be all 100% percentage based you would not need auto-scaling and if you use auto-scaling you would not need percentage sizes as the pixel values are being transformed by the auto-scaling.
    The reason why it is a mix is that, especially the animation css, uses pixel values as percentages are very glitchy in css code when being used in webkit-transformation. Ian could have changed this by declaring css properties in the javascript where you can use percentages, e.g. screen.height*0.75 +"px" equals 75% of screen height.
    But Chevy is right as well 75% of screen height is different pixel value on different screens and when it comes to the bottom where the dock is then the height of the dock is also different pixel values on different screens. Dock icons might look all the same size, but their pixel values are very different on different screens.
    Nothing is impossible only miracles take a bit longer!
    2017-01-28 10:16 AM
  2. rasputin007's Avatar
    Once you see how many software updates or lack there of.. Samsung produces for their phones, you may just change your mind. Been there done that. Was a pain in the a*s. Nothing like apple. Don't get me wrong, I like Samsung's phones, I just don't like their lack of support.
    That's why you should check out X D A. There are tons of custom firmwares with much faster bug fixing and support, the choice is yours and if you can't decide then use multirom so you can choose what firmware you want to run. At least Android does not need a JB to be customised.
    Nothing is impossible only miracles take a bit longer!
    2017-01-28 10:24 AM
  3. NewD's Avatar
    Percentages of a one number will never be equal with the same percentage of another number. For instance 10% of 1000px is 100px. 10% of 2000px is 200px. The same percentage will represent a different displacement on different screen sizes.
    Except - the way Ian implements it is % of a 100% width and height. In the body tag he specifies height: 100% and width: 100%.. That will necessarily mean 80% listed elsewhere will be 80% of the 100% screen size.. tall or wide. The only place pixels are specified are in the RESIZE THE BODY section where you see document.body.style.height='568px';.. for iPhone 5, etc.. But that's the entire screen.. 88% of 568px height should be the exact same position on the screen as 88% of 667px height? At least in the math I learned in high school. LOL.. What am I missing..

    That could also partly due to the mixed scaling system Ian uses. If UniAW would be all 100% percentage based you would not need auto-scaling and if you use auto-scaling you would not need percentage sizes as the pixel values are being transformed by the auto-scaling..
    I think you and I are looking at a different UniAW7. It's COMPLETE 100% based.. All the bases since U7 have been.
    The reason why it is a mix is that, especially the animation css, uses pixel values as percentages are very glitchy in css code when being used in webkit-transformation. Ian could have changed this by declaring css properties in the javascript where you can use percentages, e.g. screen.height*0.75 +"px" equals 75% of screen height.
    Hmm I still see all % based method being used there too. And you CAN use % method in javascript as this:
    document.getElementById("APIName").style.top = 84.5 + "%";
    ..yields the exact same positioning as this:
    $("#APIName").css({"top":"84.5%"});
    But Chevy is right as well 75% of screen height is different pixel value on different screens and when it comes to the bottom where the dock is then the height of the dock is also different pixel values on different screens. Dock icons might look all the same size, but their pixel values are very different on different screens.
    How can this be so? Where I can read about this in Apple literature. The dock is in the EXACT same position on my 5S as it is on 7Plus.. to my eye.. and on a pixel basis. Please elaborate. I need to be able to test what you are telling me. That's the way I learn - by testing.

    And thanks, gentlemen for your responses.. but I'm not sure it explains what I'm experiencing yet. I should be able to get 88% of a full screen height to work on all phone to place the text in the exact same relative position. That was the whole reason Ian converted to % method.

    EDITED:
    Well using screen.height*0.75 +"px" yielded the exact same screen positioning discrepancies on different phones as using document.getElementById("APIName").style.top =75 + "%";. So that's not the answer... BUT.. I did notice, something one of you said earlier.. that as I look at the dock position on my 5S compared to the dock position on my 7Plus.. The 5S dock is slightly further up the screen than on my 7Plus.. Now they're also on two different firmwares. The 5S is on 8.4. I wonder if Apple changed relative dock position on in more recent firmwares.. I actually discovered the problem I desbribe here on my iPhone 6 on 9.3.3.. U7 places items further down the screen in different relation to the dock.. But maybe it's just an optical illusion. Maybe it IS in the exact same % position of a full screen height on all phones.. but the DOCK's position is different based on phone size.. That would SUCK!!! But still addressable in javascript for the lower elements. Just more code to detect for which phone you're on.. Ugggh.. Why would Apple change the relative dock position.. uuuggh.
    Last edited by NewD; 2017-01-28 at 06:27 PM. Reason: New updates..
    2017-01-28 05:52 PM
  4. King_O_Hill's Avatar
    I think your assuming that the dock position and size is set as an equal percentage on devices. Is it not possible that Apple has placed the dock and sized it based on what they felt it should be and that is not equal to a percentage?

    Your way overthinking this very simplistic concept.


    Sent from my iPhone using Tapatalk

    Check out WW3 for iOS 9/10 - Widget-Weather 3.0
    2017-01-28 06:47 PM
  5. rasputin007's Avatar
    Except - the way Ian implements it is % of a 100% width and height. In the body tag he specifies height: 100% and width: 100%.. That will necessarily mean 80% listed elsewhere will be 80% of the 100% screen size.. tall or wide. The only place pixels are specified are in the RESIZE THE BODY section where you see document.body.style.height='568px';.. for iPhone 5, etc.. But that's the entire screen.. 88% of 568px height should be the exact same position on the screen as 88% of 667px height? At least in the math I learned in high school. LOL.. What am I missing..
    OK, 80% of screen height is the same position in relative terms just as percentage is a relative term. On the 5 and the 7+ you have 80% of the screen height above you and 20% of the screen height blow you.
    Now when it comes to proper pixel position it all looks different. On the 5 80% is at 454.4 pixels and on the 7 80% is at pixel 588.8. So what are the 20% of screen below where the dock is. On the 5 these 20% are 113.6 pixel and on the 7+ those 20% of the screen height are 147.2 pixel. Now take into account how big the Dock icons are, the 5 uses @2 png's and 7+ uses @3 png's.



    I think you and I are looking at a different UniAW7. It's COMPLETE 100% based.. All the bases since U7 have been.
    Hmm ... then have a look at UniAW7.1_WW3_10-15b, should be familiar with that one, open Animation.css - as I was talking about the animation in my post. Then look at entries that starts with @-webkit-keyframes. Guess what they are in pixel and not %! Here is the example of the float animation for clouds
    Code:
    @-webkit-keyframes float {
    	0%	 { -webkit-transform: translate3d(-50px,0px,0px); }
    	100% { -webkit-transform: translate3d(414px,0px,0px); }
    }
    Imagine Apple pumps up the resolution on the next iPhone with a screen width of over 500px, then all clouds will disappear before they reached the right edge.
    That what I meant with mix systems, percentage in the Style.css, but pixel in the Animation.css.

    I noticed this as I used UniAW on my old non-retina iPad mini which has a screen width of 768!

    Same with meteor animation which move either 60px /100px in screen height, that is equal to 8.15% / 13.58 % of screen height on the 7+, but only 5.8% / 9.7% of screen height on my iPad mini.
    Last edited by rasputin007; 2017-01-28 at 07:30 PM.
    Nothing is impossible only miracles take a bit longer!
    2017-01-28 07:18 PM
  6. NewD's Avatar
    I think your assuming that the dock position and size is set as an equal percentage on devices. Is it not possible that Apple has placed the dock and sized it based on what they felt it should be and that is not equal to a percentage?

    Your way overthinking this very simplistic concept.
    Why WOULD Apple change it?? Doesn't make any sense.. But you're right... their prerogative..

    OK, 80% of screen height is the same position in relative terms just as percentage is a relative term. On the 5 and the 7+ you have 80% of the screen height above you and 20% of the screen height blow you.
    Now when it comes to proper pixel position it all looks different. On the 5 80% is at 454.4 pixels and on the 7 80% is at pixel 588.8. So what are the 20% of screen below where the dock is. On the 5 these 20% are 113.6 pixel and on the 7+ those 20% of the screen height are 147.2 pixel. Now take into account how big the Dock icons are, the 5 uses @2 png's and 7+ uses @3 png's.
    You were correct until that last statement.. All icons on all phones ever made are 60 points = (1x 60px, 2x 120px, 3x 180px).. So all icons are same 'visual' size on all phones when they're sitting side by side. That's why 5 icons across on a 5S are WAY more crowded than 5 icons across on a 7Plus. I think King_O_Hill is right.. Apple just capriciously chose different position for the dock on the larger phones.. It's not SITTING at the same, let's say, 85% position on 4", 4.7" and 5.5" phones. Bummer.

    Hmm ... then have a look at UniAW7.1_WW3_10-15b, should be familiar with that one, open Animation.css - as I was talking about the animation in my post. Then look at entries that starts with @-webkit-keyframes. Guess what they are in pixel and not %! Here is the example of the float animation for clouds
    Code:
    @-webkit-keyframes float {
    	0%	 { -webkit-transform: translate3d(-50px,0px,0px); }
    	100% { -webkit-transform: translate3d(414px,0px,0px); }
    }
    Yes, of course.. But for the animations.. that doesn't matter.. because he sets 'overflow' to 'hidden'.. So he just wanted to make sure all animations traversed the full width of all phone sizes.. The pixel use there affects no POSITIONING - so no % of a full width or height is needed to achieve the goal of the animations (traverse whole screen width). On iPads that 414 number would have to be increased of course.. So the animations.css file isn't really compatible with iPad.. We need to rework that one day, Ras.
    Imagine Apple pumps up the resolution on the next iPhone with a screen width of over 500px, then all clouds will disappear before they reached the right edge.
    As they do on iPad now..
    That what I meant with mix systems, percentage in the Style.css, but pixel in the Animation.css.
    As I said above.. on existing phones on the market.. % isn't needed for animations.css... as overflow is hidden and 414px travel length is adequate for all phones.. Insufficient for iPad.. we agree.

    Here's my solution for this frustrating situation of the Dock apparently not being in the same position on all iPhone sizes... This kind of code would only be needed for CSS elements near the dock on SB.
    Code:
    // ADJUST TOP POSITION OF OTHER ELEMENTS
    if (iOS == true) {
    	if (screen.height == 480) { document.getElementById("APIName").style.top = 81.5 + "%"; }	
    	else if (screen.height == 568) { document.getElementById("APIName").style.top = 82.5 + "%"; }
    	else if (screen.height == 667) { document.getElementById("APIName").style.top = 83.5 + "%"; }
    	else { document.getElementById("APIName").style.top = 84.5 +"%"; }
    } else {
    	document.getElementById("APIName").style.top = 84.5 + "%"; //screen height set to 'auto'
    }
    Last edited by NewD; 2017-01-28 at 07:55 PM.
    2017-01-28 07:38 PM
  7. rasputin007's Avatar
    This is another example, the astronaut. Just floating over half way on the iPad mini with it's screen width of 768px because of this
    Code:
    @-webkit-keyframes astronaut_anim {
    	0%	 { -webkit-transform: translate3d(0px, 0px, 0px) scale3d(0.0, 0.0, 1.0) rotateZ(-40deg) }
    	5%	 { -webkit-transform: translate3d(10px, 2px, 0px) scale3d(0.1, 0.1, 1.0) rotateZ(-20deg) }
    	10%  { -webkit-transform: translate3d(20px, 4px, 0px) scale3d(0.2, 0.2, 1.0) rotateZ(0deg) }
    	15%  { -webkit-transform: translate3d(30px, 6px, 0px) scale3d(0.3, 0.3, 1.0) rotateZ(20deg) }
    	20%  { -webkit-transform: translate3d(40px, 8px, 0px) scale3d(0.4, 0.4, 1.0) rotateZ(40deg) }
    	25%  { -webkit-transform: translate3d(50px, 10px, 0px) scale3d(0.5, 0.5, 1.0) rotateZ(20deg) }
    	30%  { -webkit-transform: translate3d(60px, 12px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(0deg) }
    	35%  { -webkit-transform: translate3d(70px, 14px, 0px) scale3d(0.7, 0.7, 1.0) rotateZ(-20deg) }
    	40%  { -webkit-transform: translate3d(80px, 16px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(-40deg) }
    	45%  { -webkit-transform: translate3d(90px, 18px, 0px) scale3d(0.9, 0.9, 1.0) rotateZ(-20deg) }
    	50%  { -webkit-transform: translate3d(110px, 20px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg) }
    	55%  { -webkit-transform: translate3d(130px, 22px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(20deg) }
    	60%  { -webkit-transform: translate3d(160px, 24px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(40deg) }
    	65%  { -webkit-transform: translate3d(190px, 26px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(20deg) }
    	70%  { -webkit-transform: translate3d(220px, 28px, 0px) scale3d(1.8, 1.8, 1.0) rotateZ(0deg) }
    	75%  { -webkit-transform: translate3d(250px, 30px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(-20deg) }
    	80%  { -webkit-transform: translate3d(280px, 32px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(-40deg) }
    	85%  { -webkit-transform: translate3d(310px, 34px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(-20deg) }
    	90%  { -webkit-transform: translate3d(340px, 36px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg) }
    	95%  { -webkit-transform: translate3d(370px, 38px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(20deg) }
    	100% { -webkit-transform: translate3d(440px, 40px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(40deg) }
    }
    I changed it to
    Code:
    var style = document.documentElement.appendChild(document.createElement("style")),
    rule = " astroMove {\
        0%	 { -webkit-transform: translate3d(0px, 0px, 0px) scale3d(0.0, 0.0, 1.0) rotateZ(-40deg); }\
    	5%	 { -webkit-transform: translate3d("+screen.width*0.05+"px, 2px, 0px) scale3d(0.1, 0.1, 1.0) rotateZ(-20deg); }\
    	10%  { -webkit-transform: translate3d("+screen.width*0.1+"px, 4px, 0px) scale3d(0.2, 0.2, 1.0) rotateZ(0deg); }\
    	15%  { -webkit-transform: translate3d("+screen.width*0.15+"px, 6px, 0px) scale3d(0.3, 0.3, 1.0) rotateZ(20deg); }\
    	20%  { -webkit-transform: translate3d("+screen.width*0.2+"px, 8px, 0px) scale3d(0.4, 0.4, 1.0) rotateZ(40deg); }\
    	25%  { -webkit-transform: translate3d("+screen.width*0.25+"px, 10px, 0px) scale3d(0.5, 0.5, 1.0) rotateZ(20deg); }\
    	30%  { -webkit-transform: translate3d("+screen.width*0.3+"px, 12px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(0deg); }\
    	35%  { -webkit-transform: translate3d("+screen.width*0.35+"px, 14px, 0px) scale3d(0.7, 0.7, 1.0) rotateZ(-20deg); }\
    	40%  { -webkit-transform: translate3d("+screen.width*0.4+"px, 16px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(-40deg); }\
    	45%  { -webkit-transform: translate3d("+screen.width*0.45+"px, 18px, 0px) scale3d(0.9, 0.9, 1.0) rotateZ(-20deg); }\
    	50%  { -webkit-transform: translate3d("+screen.width*0.5+"px, 20px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg); }\
    	55%  { -webkit-transform: translate3d("+screen.width*0.55+"px, 22px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(20deg); }\
    	60%  { -webkit-transform: translate3d("+screen.width*0.6+"px, 24px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(40deg); }\
    	65%  { -webkit-transform: translate3d("+screen.width*0.65+"px, 26px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(20deg); }\
    	70%  { -webkit-transform: translate3d("+screen.width*0.7+"px, 28px, 0px) scale3d(1.8, 1.8, 1.0) rotateZ(0deg); }\
    	75%  { -webkit-transform: translate3d("+screen.width*0.75+"px, 30px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(-20deg); }\
    	80%  { -webkit-transform: translate3d("+screen.width*0.8+"px, 32px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(-40deg); }\
    	85%  { -webkit-transform: translate3d("+screen.width*0.85+"px, 34px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(-20deg); }\
    	90%  { -webkit-transform: translate3d("+screen.width*0.9+"px, 36px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg); }\
    	95%  { -webkit-transform: translate3d("+screen.width*0.95+"px, 38px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(20deg); }\
    	100% { -webkit-transform: translate3d("+screen.width*1+"px, 40px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(40deg); }\
    }";
    style.sheet.insertRule("@-webkit-keyframes " + rule, 0);
    in the javascript and now it works on any screen width and the astronaut floats from left edge to right edge and back.
    Nothing is impossible only miracles take a bit longer!
    2017-01-28 07:58 PM
  8. NewD's Avatar
    This is another example, the astronaut. Just floating over half way on the iPad mini with it's screen width of 768px because of this
    Code:
    @-webkit-keyframes astronaut_anim {
    	0%	 { -webkit-transform: translate3d(0px, 0px, 0px) scale3d(0.0, 0.0, 1.0) rotateZ(-40deg) }
    	5%	 { -webkit-transform: translate3d(10px, 2px, 0px) scale3d(0.1, 0.1, 1.0) rotateZ(-20deg) }
    	10%  { -webkit-transform: translate3d(20px, 4px, 0px) scale3d(0.2, 0.2, 1.0) rotateZ(0deg) }
    	15%  { -webkit-transform: translate3d(30px, 6px, 0px) scale3d(0.3, 0.3, 1.0) rotateZ(20deg) }
    	20%  { -webkit-transform: translate3d(40px, 8px, 0px) scale3d(0.4, 0.4, 1.0) rotateZ(40deg) }
    	25%  { -webkit-transform: translate3d(50px, 10px, 0px) scale3d(0.5, 0.5, 1.0) rotateZ(20deg) }
    	30%  { -webkit-transform: translate3d(60px, 12px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(0deg) }
    	35%  { -webkit-transform: translate3d(70px, 14px, 0px) scale3d(0.7, 0.7, 1.0) rotateZ(-20deg) }
    	40%  { -webkit-transform: translate3d(80px, 16px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(-40deg) }
    	45%  { -webkit-transform: translate3d(90px, 18px, 0px) scale3d(0.9, 0.9, 1.0) rotateZ(-20deg) }
    	50%  { -webkit-transform: translate3d(110px, 20px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg) }
    	55%  { -webkit-transform: translate3d(130px, 22px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(20deg) }
    	60%  { -webkit-transform: translate3d(160px, 24px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(40deg) }
    	65%  { -webkit-transform: translate3d(190px, 26px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(20deg) }
    	70%  { -webkit-transform: translate3d(220px, 28px, 0px) scale3d(1.8, 1.8, 1.0) rotateZ(0deg) }
    	75%  { -webkit-transform: translate3d(250px, 30px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(-20deg) }
    	80%  { -webkit-transform: translate3d(280px, 32px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(-40deg) }
    	85%  { -webkit-transform: translate3d(310px, 34px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(-20deg) }
    	90%  { -webkit-transform: translate3d(340px, 36px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg) }
    	95%  { -webkit-transform: translate3d(370px, 38px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(20deg) }
    	100% { -webkit-transform: translate3d(440px, 40px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(40deg) }
    }
    I changed it to
    Code:
    var style = document.documentElement.appendChild(document.createElement("style")),
    rule = " astroMove {\
        0%	 { -webkit-transform: translate3d(0px, 0px, 0px) scale3d(0.0, 0.0, 1.0) rotateZ(-40deg); }\
    	5%	 { -webkit-transform: translate3d("+screen.width*0.05+"px, 2px, 0px) scale3d(0.1, 0.1, 1.0) rotateZ(-20deg); }\
    	10%  { -webkit-transform: translate3d("+screen.width*0.1+"px, 4px, 0px) scale3d(0.2, 0.2, 1.0) rotateZ(0deg); }\
    	15%  { -webkit-transform: translate3d("+screen.width*0.15+"px, 6px, 0px) scale3d(0.3, 0.3, 1.0) rotateZ(20deg); }\
    	20%  { -webkit-transform: translate3d("+screen.width*0.2+"px, 8px, 0px) scale3d(0.4, 0.4, 1.0) rotateZ(40deg); }\
    	25%  { -webkit-transform: translate3d("+screen.width*0.25+"px, 10px, 0px) scale3d(0.5, 0.5, 1.0) rotateZ(20deg); }\
    	30%  { -webkit-transform: translate3d("+screen.width*0.3+"px, 12px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(0deg); }\
    	35%  { -webkit-transform: translate3d("+screen.width*0.35+"px, 14px, 0px) scale3d(0.7, 0.7, 1.0) rotateZ(-20deg); }\
    	40%  { -webkit-transform: translate3d("+screen.width*0.4+"px, 16px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(-40deg); }\
    	45%  { -webkit-transform: translate3d("+screen.width*0.45+"px, 18px, 0px) scale3d(0.9, 0.9, 1.0) rotateZ(-20deg); }\
    	50%  { -webkit-transform: translate3d("+screen.width*0.5+"px, 20px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg); }\
    	55%  { -webkit-transform: translate3d("+screen.width*0.55+"px, 22px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(20deg); }\
    	60%  { -webkit-transform: translate3d("+screen.width*0.6+"px, 24px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(40deg); }\
    	65%  { -webkit-transform: translate3d("+screen.width*0.65+"px, 26px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(20deg); }\
    	70%  { -webkit-transform: translate3d("+screen.width*0.7+"px, 28px, 0px) scale3d(1.8, 1.8, 1.0) rotateZ(0deg); }\
    	75%  { -webkit-transform: translate3d("+screen.width*0.75+"px, 30px, 0px) scale3d(1.6, 1.6, 1.0) rotateZ(-20deg); }\
    	80%  { -webkit-transform: translate3d("+screen.width*0.8+"px, 32px, 0px) scale3d(1.4, 1.4, 1.0) rotateZ(-40deg); }\
    	85%  { -webkit-transform: translate3d("+screen.width*0.85+"px, 34px, 0px) scale3d(1.2, 1.2, 1.0) rotateZ(-20deg); }\
    	90%  { -webkit-transform: translate3d("+screen.width*0.9+"px, 36px, 0px) scale3d(1.0, 1.0, 1.0) rotateZ(0deg); }\
    	95%  { -webkit-transform: translate3d("+screen.width*0.95+"px, 38px, 0px) scale3d(0.8, 0.8, 1.0) rotateZ(20deg); }\
    	100% { -webkit-transform: translate3d("+screen.width*1+"px, 40px, 0px) scale3d(0.6, 0.6, 1.0) rotateZ(40deg); }\
    }";
    style.sheet.insertRule("@-webkit-keyframes " + rule, 0);
    in the javascript and now it works on any screen width and the astronaut floats from left edge to right edge and back.
    Exactly!! If you take the time to convert the whole animation.js. I will surely include it in the new base, Ras.
    2017-01-28 08:02 PM
  9. NewD's Avatar
    Okay.. order in my universe is restored!! % height method is identical on all phones using Ian's method.. it's just the placement of the Dock on different phones that screws up perceptions. In the two pics below you see that 96.5% height is exactly the same distance from the bottom of the screen on both my 5S and my 7+. It's the dock that is sitting much lower on a plus size phone than on a 4 inch phone. Wild! You're killing me, APPLE!!!!
    Data Source line at 96% on a 7Plus:



    Data Source line at 96% on a 5S:



    And as is clear in screenshots… You can see that all icons are identical in actual size on any iPhone. They just take up more SB space on a smaller iPhone than they do on a larger phone.
    Last edited by NewD; 2017-01-28 at 09:59 PM.
    2017-01-28 09:52 PM
  10. NewD's Avatar
    2017-01-28 09:53 PM
  11. King_O_Hill's Avatar
    Damn, I hate it when I'm right.


    Sent from my iPhone using Tapatalk

    Check out WW3 for iOS 9/10 - Widget-Weather 3.0
    2017-01-29 05:06 AM
  12. habs4_6@hotmail.com's Avatar
    Sorry gang.. Haven't updated in a while while we're all learning this iOS10.1.1 beta jailbreak.. Had it since first day in late December 2016.. Working pretty well for me. And it looks like Luca Todesco has a 10.2 jailbreak right around the corner for people on 10.2 who've been waiting. iPhone 5S, 6, 6Plus, 6S, 6SPlus, SE... but not 7/7Plus..

    Anyway.. Here is the most recent update of the UniAW7.1_WW3 that I've been asking modder to work with for Animation based mods. A couple of substantive updates here - but if you've made a mod based on my recent past ones.. all you should need to change out is the main.js. If your mod only has changes in the style.css and html files.. all should be good..

    https://dl.dropboxusercontent.com/u/...iAW7.1_WW3.zip

    You also really need this map.xml too.. in var/mobile/Library/WidgetWeather.
    Rename the one that's there now to map_2016.xml. Then unzip this one - rename it to map.xml
    https://dl.dropboxusercontent.com/u/...p_2017.xml.zip

    I'm a forever 'tweaker' with this stuff.. And that's why I still haven't released my NewD_Mod yet.. But I'm almost there.. trust me. By the time the new jailbreak hits I will release in whatever format I have.. It has a new RIGHT CONTAINER that shows, depending on the weather forecast data this:
    One non precipitation days:
    Humidity
    Cloud Cover%
    Elevation
    % Precip Chance
    Sunrise
    Sunset

    On Days when storms are under 25 miles away:
    Humidity
    Cloud Cover%
    Elevation
    % Precip Chance
    Storm Distance
    Storm Bearing

    And on days when precip is happening, rain or snow
    Humidity
    Cloud Cover%
    Elevation
    Forecasted Rain/Snow
    Current Accumulated Precip
    Precip Intensity per hour

    On LS that right box is scrolling.. with even more data at bottom.

    Be checking back in soon..

    First of all, I think the UniAW theme is the main and/or #1 reason I jailbreak my phone and have since the iPhone 3. So, many, many thanks to all of the devs that made this possible.

    I have been able to figure out how to solve most issues in the past by searching for the answer. However this one that I cannot figure out what I did incorrectly. All appears on the SB as correct...it just only updates with a respring...what am I missing?

    Using and followed all above guidelines above on Iphone 6plus on 10.0.1 with Anemone 2.1.1-8...weather selected as default and using the latest WW3 3.0-12
    2017-02-02 09:36 PM
  13. bliken's Avatar
    First of all, I think the UniAW theme is the main and/or #1 reason I jailbreak my phone and have since the iPhone 3. So, many, many thanks to all of the devs that made this possible.

    I have been able to figure out how to solve most issues in the past by searching for the answer. However this one that I cannot figure out what I did incorrectly. All appears on the SB as correct...it just only updates with a respring...what am I missing?

    Using and followed all above guidelines above on Iphone 6plus on 10.0.1 with Anemone 2.1.1-8...weather selected as default and using the latest WW3 3.0-12


    Automatic update doesn't work in Anemone.
    2017-02-02 09:50 PM
  14. habs4_6@hotmail.com's Avatar
    Thanks blinken...does the old SBHTML work and update accordingly and on ios10?
    2017-02-02 10:14 PM
  15. bliken's Avatar
    not sure about SBHTML but XENHTML works I heard....hoping it gets updated and released soon
    2017-02-02 10:23 PM
  16. habs4_6@hotmail.com's Avatar
    I'll check that out...thanks, once again!
    2017-02-02 10:26 PM
  17. NewD's Avatar
    Thanks bliken...does the old SBHTML work and update accordingly and on ios10?
    No. SBHTML is dead in iOS' 9 and 10. XenHTML has not been updated yet for 10. So AnemoneHTML is your only choice right now. You get used to having to Respring a few times a day.

    iWidgets can also be used on your Springboard and they automatically update. BUT you can't use the full screen weather walls of UniAW7 - or they'll cover up your icons and you won't be able to see them.

    So right now you DO have options.. but nothing as perfect as the old SBHMTL or the newer XenHTML.
    2017-02-02 10:44 PM
  18. habs4_6@hotmail.com's Avatar
    No. SBHTML is dead in iOS' 9 and 10. XenHTML has not been updated yet for 10. So AnemoneHTML is your only choice right now. You get used to having to Respring a few times a day.

    iWidgets can also be used on your Springboard and they automatically update. BUT you can't use the full screen weather walls of UniAW7 - or they'll cover up your icons and you won't be able to see them.

    So right now you DO have options.. but nothing as perfect as the old SBHMTL or the newer XenHTML.
    Thanks NewD. This is good to know.
    2017-02-02 11:15 PM
  19. chevymusclecar's Avatar
    ‪BLUR Lockscreen iOS10‬

    https://twitter.com/70impala206/stat...89924584173568



    UniAW7


    Sent from my iPhone using Tapatalk Pro
    Last edited by chevymusclecar; 2017-02-06 at 07:30 AM.
    2017-02-06 06:57 AM
  20. morkino's Avatar
    Need help...
    Using uniaw7.1 on lockscreen.
    (Still iOS 8.3)
    ONLY when weather condition is "CLOUDY" the clouds are going over the wallpaper, with other conditions (mostly cloudy, partly cloudy...) they stay under...
    Any idea?
    2017-02-08 09:40 PM
LINK TO POST COPIED TO CLIPBOARD