Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    adding text slide

    General Discussion
    2
    5
    1123
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • A
      alessia.pennetta last edited by

      Hi Armin
      How can i add a text slide like in this example when clicking on i for info:
      http://www.neesermueller.ch/#goldschmiede-martin-kurt-inserate
      I want the text on my website appearing only when clicking on a "button".
      Is this possible?
      Thank you a lot in advance.

      Alessia

      1 Reply Last reply Reply Quote 0
      • mariusjopen
        mariusjopen Global Moderator last edited by

        Hey Alessia!

        You can give an element a class or id.
        This div you can show or hide when you click on a button.

        You will need some basic jQuery knowledge to do that.

        Have a look here:
        http://jsfiddle.net/e27Dt/

        Let me know if you have questions.

        Best!

        Marius

        www.mariusjopen.world

        1 Reply Last reply Reply Quote 0
        • A
          alessia.pennetta last edited by

          Hi Marius
          Thank you a lot for your response. Is there no possibility to do that without jquery? Because i have no knowledge at all. Or maybe only with a css change, without touching the html?
          Thanks.
          Best!
          Alessia

          1 Reply Last reply Reply Quote 0
          • mariusjopen
            mariusjopen Global Moderator last edited by

            Hi Alessia,

            mhm. Not really. You cannot work with pure CSS.

            jQuery is actually made for exactly those interactions.

            Ok, I solved it for you in a way.
            If you want to get more specific or into detail you should make a jQuery course at Codeacademy. Very useful in general.

            Here we go:

            The Button Text will be the button. The image is hidden and will be visible on click.
            0_1504684964978_Bildschirmfoto 2017-09-06 um 09.46.43.png

            You give the button the class .buttonand the image the class .hide.
            0_1504685193728_Bildschirmfoto 2017-09-06 um 10.06.17.png

            0_1504685201294_Bildschirmfoto 2017-09-06 um 10.06.24.png

            Then in the custom HTML section you will add the following in the CSS box:

            .hide {
                display: none;
            }
            
            .show {
                display: block !important;
            }
            

            And this in the Custom Head Content box:

            <script>
            jQuery(document).on("click", ".button", function(event) {
            	 jQuery(".hide").toggleClass("show");
            });
            </script>
            

            That should work. it is the basic. From there on you can built it up yourself.

            All the best!

            Marius

            www.mariusjopen.world

            1 Reply Last reply Reply Quote 0
            • A
              alessia.pennetta last edited by

              Hi Marius,
              Thank you so much for your big and quickly help. It works. I'm so happy, you made my day:)!

              Best!
              Alessia

              1 Reply Last reply Reply Quote 0
              • First post
                Last post

              Before you post

              Use the Search Feature. Maybe there is already a solution to your issue.

              1. Update Lay Theme and all Lay Theme Addons
              2. Disable all Plugins
              3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
              4. Now see if your problem solved itself
              5. Go here, see if your problem is listed here:
              Troubleshooting

              When you post:
              1. Post a link to where the problem is
              2. If the problem is difficult to explain, post screenshots / link to a video to explain it

              Thanks!

              Online Users

              T

              Recent Topics

              • A

                Unable to update lay theme / to login wp admin

              • A

                New button feature not available

              • S

                Theme crashed - because of Polylang?

              • A

                carousel addon not working after update

              laytheme.com