Jump to content
Sign in to follow this  
studio37

Gadget different appearance on mobile devices

Recommended Posts

studio37+    0
studio37

Hi,

I like the gadget, and I have it on my website http://www.studio37.de to provide a link to my facebook-page.

I only have one problem with it:

If the gadget icon is shown permanently, it disturbs the appearance of the page viewed on a mobile device. On the other hand, if the icon is only shown on hover, it is not "showy" enough on a normal monitor.

Is there a way to let a mobile device show the icon only on hover, while it is displayed permanently on a normal monitor?

 

I also use the Mobile Menu plugin. is it possible to add something to it's CSS to let the gadged change?

 

Thanks for an answer,

Andreas

 

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi Andreas,

 

Not sure what you mean when you say "s there a way to let a mobile device show the icon only on hover". How do you hover on a mobile device ?


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
studio37+    0
studio37

Hi Ninja,

thanks for the quick reply. Of course I was completely on the wrong path: on a mobile device there is no "hover".

So the question has to be:

Is there a way to show the gadget icon on a normal computer, and suppress it on a mobile phone?

Thanks a lot,

Andreas

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

The simplest method to disable Gadget on mobile devices would be to hide it via CSS. You can do this by installing/enabling Browser Specific CSS plugin. Once enabled, you can use one of the unique classes added to your site and use this class in your custom CSS which is targeting Gadget and use display:none;

 

This will hide Gadget on mobile devices viewing your site.

 

For more information on the Browser Specific CSS plugin, see here - http://support.pagelines.me/docs/plugins/browser-specific-css/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
studio37+    0
studio37

I have enabled Browser Specific CSS plugin.

I have added

 

pl-gadget.iphone {
  display:none;
}

 

to my Custom CSS.

 

Nothing changes, the gadget is still displayed.

Share this post


Link to post
Share on other sites
studio37+    0
studio37

OK, it's

 

body.iphone .pl-gadget {
  display:none;
}

 

Thanks!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Similar Content

    • dreamsight
      By dreamsight+
      No icons showing in Gadget. Is compatible with DMS 2? Anyway to add our own icons to it?
    • blueemerald
      By blueemerald
      HI there..

      very happy so far with Pagelines and the ease with which I can use it. I do however have a query.

      I quite like gadget and am currently using it. I would however like to change the colors to match the scheme of my site, perhaps make the color of the bar transparent and change icon and font colors. I simply can't find the css for this plug in anywhere.
       
      Any hints guys?
    • aerta
      By aerta
      Hi,

      Apologies if this is covered elsewhere, but I couldn't find any reference to it anywhere, but...

      Is it possible to add more tabs to the gadget plugin? There are five available in Global Settings but I need more...

      Thanks,

      John
    • Veltig
      By Veltig
      Apologies in advance for an invalid Topic Prefix.  "Gadget" was no where to be found on that drop-down list.
       
      As for my issue with Gadget:
       
      All five (5) links have been configured, and icons selected, but only 1-3 appear.
       
      I've looked for a setting that might control the # of links/icons to display, but haven't found any.
       
      Any suggestions?

      Thank you.
       
×