Treefrognursery template on touchscreen
Treefrognursery template on touchscreen
I have found a problem with http://treefrognursery.cmsimple.sk when opened on touch screen devices. The four frogs on welcome screen have attached expandable DIVs with "hover" attribute. But on devices with touscreen (iPad/mobile) the "hovering" does not work as expected. How suggest you to solve it?
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: Treefrognursery template on touchscreen
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“ Ludwig's XH-Templates for MultiPage & OnePage
Re: Treefrognursery template on touchscreen
Thx, will give a try.
@EDIT
extended ":hover" by ":focus"
Nothin has changed. On iPad does it not work. On ":hover" shall the DIV change its height And eexpand shoving the hidden cintent. On click then shall it open the target of the link.
On ":hover" it does nothing, after click it leads to new page. Only on return to previous page the hidden DIV is shown.
@EDIT
extended ":hover" by ":focus"
Nothin has changed. On iPad does it not work. On ":hover" shall the DIV change its height And eexpand shoving the hidden cintent. On click then shall it open the target of the link.
On ":hover" it does nothing, after click it leads to new page. Only on return to previous page the hidden DIV is shown.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: Treefrognursery template on touchscreen
Interessant, zumindest auf meinem Smartphone HTC Desire S. Klickt man auf eine freie Stelle, z.B. links oder rechts vom Text "TREE FROG NURSERY", so erscheint der verteckte Text wie bei hover. Das heißt das Touch auf eine freie Stelle wird als hover interpretiert. Vielleicht mag das jemand mit anderen mobilen Geräten testen und berichten.
@Tata
You can use/try the useful css3 :target selector, additional to hover.
Hover for Desktop devices, target for mobil devices.
Something like this might work. Not testet! Without the template, it is always a problem.
Create a "Read more" -Link visible over the hidden Text under "TREE FROG NURSERY" with <a href="#readmore">Read more</a>
Give the hidden Text an id <p id="readmore" ...
Hide Text
#readmore {display: none;}
Display Text by hover
.newsbox1-in:hover #readmore {display: block;}
Display Text by target by click the link
#readmore:target {display: block;}
@Tata
You can use/try the useful css3 :target selector, additional to hover.
Hover for Desktop devices, target for mobil devices.
Something like this might work. Not testet! Without the template, it is always a problem.
Create a "Read more" -Link visible over the hidden Text under "TREE FROG NURSERY" with <a href="#readmore">Read more</a>
Give the hidden Text an id <p id="readmore" ...
Hide Text
#readmore {display: none;}
Display Text by hover
.newsbox1-in:hover #readmore {display: block;}
Display Text by target by click the link
#readmore:target {display: block;}
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“ Ludwig's XH-Templates for MultiPage & OnePage