Hide label/handle/tab

  • Resolved daveh0

    (@daveh0)


    9 years, 1 month ago

    I have a ‘contact us’ button in the header of my page. Clicking it executes the following JavaScript: jQuery('#wpcs_handle').click()

    This works as intended. I would like for that button to be the only way to access the slider and contact form. Is there a way to hide its handle?

    Because it sets display:block as an inline style, CSS is out. I tried placing jQuery('#wpcs_handle').hide() in my jQuery ready() function but it is still being displayed. I’m guessing the plugin code runs after my ready() function.

    I can make all of its elements transparent via CSS, but that seems like a ginormous hack. Anyone have any better ideas?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter daveh0

    (@daveh0)

    9 years, 1 month ago

    I came up with a solution for now. In wpcs_frontend_functions.php, I commented out the line (and it’s setTimeout wrapper):

    jQuery('a#wpcs_handle').fadeTo("slow", 1);

    This prevents the tab from from fading in when the page loads and the plugin initializes. I’m not sure if there’s a way to achieve this without editing plugin source code, but that would be ideal. If anyone is aware of a better way, please do share.

    Thanks!!

    Plugin Author WPExperts.io

    (@wpexpertsio)

    9 years, 1 month ago

    Hi there!

    Yp you are right about editing plugin core directly is bad practice as you would have to take care of things on updates again and again.
    You can try to hide this with your child theme style sheet with following css snippet.

    
a#wpcs_handle {
    opacity: 0!important;
}

    Hope this would work for you.

    Let us know if you have any other issue on your way.

    Thanks!

    Thread Starter daveh0

    (@daveh0)

    9 years, 1 month ago

    Thanks for the response, but that doesn’t work. When the plugin is initialized, the last thing it does (before handling any user interaction) is animates the opacity of the tab from 0 to 1 with the line:

    jQuery('a#wpcs_handle').fadeTo("slow", 1);

    The resulting markup for the tab is rendered as:

    <a id="wpcs_handle" class="wpcs_handle wpcs_contact_label wpcs_right" style="width: 35px; height: 36px; display: inline outline: medium none; position: absolute; z-index: 999999999; top: 0px; right: 386px; opacity: 1;">Contact Us</a>

    As you can see, jQuery adds a bunch of inline styles to that element overriding anything defined in a stylesheet (such as the class suggested in the previous post).

    Any other suggestions? It would be great to see an upgrade where you can choose to display the tab OR choose to hide the tab and be able to specify another button/link on the page to trigger the slide. Currently I am doing the last part by manuallying firing the click event on the tab i my ready() script.

    • This reply was modified 9 years, 1 month ago by daveh0.
    Thread Starter daveh0

    (@daveh0)

    9 years, 1 month ago

    not sure how/why this got marked as “resolved”, but the answer provided by the plugin contributor does NOT work.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Hide label/handle/tab’ is closed to new replies.