Awesome, thanks Remi!

I read body > *:not(.toolbar) as "anything in the body that is not of the 
toolbar class" and knew that that is what I had to overcome. I tried body > 
*:not(.toolbar,.cornerImage) to no avail (I didn't bother to check CSS3 
docs, I just gave it a shot.) I hadn't thought to not put the image tag in 
a div, I always have, and to apply the CSS directly to it. 
I've contemplated if there are any drawbacks to not having it in a div and 
I can't seem to come up with any. Looks like this is the trick that makes 
it work! :-D

I should add that with position: absolute the image scrolls with the page. 
I was trying to fix it to the screen and position: fixed does do the trick 
(see FJRRally.com/iUI for demo.) 

Thanks again Remi! You and all the iUI contributors rock!

On Wednesday, January 23, 2013 5:36:16 AM UTC-7, Remi Grumeau wrote:
>
> body > *:not(.toolbar)
>
>
> This CSS code targets all body childnodes (aka divs, forms, ul, …) without 
> the .toolbar class set.
> Which means all screens.
> They are all hidden by default, and the attribute selected=true tells iUI 
> which one should be displayed.
>
> That's why if you add your #cornerImage div to the body, it will be 
> hidden, position absolute, top 0, left 0, width 100%, z-index 1.
> The reason of my !important test… which seems to fail :) 
>
> You might give this a look :)
> http://codepen.io/anon/pen/fIKpw
>
>
> Remi
>
> Le 23 janv. 2013 à 01:06, "Jeff (iUI Noob)" <[email protected]<javascript:>> 
> a écrit :
>
> Sorry, let me clarify...
> This code works fine on my sites such as 
> FJRRally.com/CFR<http://fjrrally.com/CFR>when displayed on iOS 5 and 6 
> devices. Of course, the image is quite small 
> as the site is not a mobile site (I was thinking of making an iUI version 
> of the site.) It does exhibit some interesting behaviour when zooming 
> though.
>
> In my iUI code, the image is not displayed at all (that I can see.)
> I've tried adding adding a display: block; !important to .cornerImage 
> with no effect. Changing this class selector to an id selector does show 
> the image, but in the 0%,0% position in the main div.
> I have also been experimenting with a Border-Image in the body > 
> *:not(.toolbar) CSS and, apparently, these 2 things do not work well 
> together.
>
> I'll play with it further, Thanks Remi!
>
> On Tuesday, January 22, 2013 3:55:49 PM UTC-7, Remi Grumeau wrote:
>>
>> Well … what do you mean by "this code does not work" ?
>> Image does not display or it does not show at the position you want?
>>
>> Absolute position is always tricky on mobile screens, note that position: 
>> fixed is supported in iOS since iOS5 only. 
>> It also works pretty bad on Android until 2.3.
>>
>> But if it does not show at all, then you might add a display: 
>> block!important to #cornerImage.
>>
>>
>> Le 22 janv. 2013 à 22:48, "Jeff (iUI Noob)" <[email protected]> a écrit :
>>
>> Ok, I've been sucked in! I can't seem to stop playing with iUI. To date, 
>> I have just built little personal webApps, but maybe one day I'll produce 
>> something useful with it.
>>
>> So... I like to put a little image in my websites that is fixed in the 
>> bottom right corner of the screen. The code I use is:
>>
>> [code]
>> <!-- Include Corner Image -->
>> <style type="text/css"> #cornerImage {position: 
>> fixed;_position:absolute;bottom:0px;right:0px;} </style>
>> <div id="cornerImage" class="cornerImage"> <img src="CornerImage.png" 
>> alt="" border="0"> </div>
>> [/code]
>>
>> This code does not work in iUI. I suspected that this would be the case 
>> due to the way iUI handles DIVs, but I'm not sure where to start to work 
>> around it.
>> Any thoughts?
>>
>> -- 
>> You received this message because you are subscribed to the Google Groups 
>> "iPhoneWebDev" group.
>> To post to this group, send email to [email protected].
>> To unsubscribe from this group, send email to 
>> [email protected].
>> Visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
>>  
>>  
>>
>>
>>
> -- 
> You received this message because you are subscribed to the Google Groups 
> "iPhoneWebDev" group.
> To post to this group, send email to [email protected]<javascript:>
> .
> To unsubscribe from this group, send email to 
> [email protected] <javascript:>.
> Visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
>  
>  
>
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"iPhoneWebDev" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
Visit this group at http://groups.google.com/group/iphonewebdev?hl=en.


Reply via email to