Hey, I appreciate your taking the time in order to explain in an easy way something that I was stressed out trying to figure out how to proceed without Premium Plugins. Following your approach, I added a variation, in order to emulate a Multi selector Filter, using Text and Icon, and having 2 cloned clickable links, one using just a squared icon, and the other one, showing a checked box and using a toggle state on both in order to show pre-selection, and after selection effects.... my customer loved the final work. Thank you so much again. 👍👍👍
@websquadron Жыл бұрын
So glad to hear it worked for you :)
@GauAus8 ай бұрын
Amazing! Just saved my day :D I've been looking for a solution for a while to create a clickable Woo Product Filter button for the mobile version, because the option with Popup didn't work - the price slider didn't appear. It's so great because everything works! Thanks a lot!
@user-moshnanach4 ай бұрын
THANKS so much for the SUPER SIMPLE explanation!!! it WORKSSSS
@NeroRapSamurai11 ай бұрын
Thank you so much for help out... Straight to the point and very understanding. You are a great teacher i must say. All love. Am a fan already
@gvconect Жыл бұрын
amazing things you can do with this code
@websquadron3 жыл бұрын
Code :) document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow').each(function(i){ $(this).click(function(){ $('.showclick').eq(i).toggle(); $('.clicktoshow'); }); }); }); }); .clicktoshow{ cursor: pointer; } .showclick{ display: none; } ------ The above is fine on it's own, but below can go a step further. document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow2').each(function(i){ $(this).click(function(){ $('.showclick2').eq(i).toggle(); $('.showclick3').eq(i).hide(); }); }); }); }); .clicktoshow2{ cursor: pointer; } .showclick2{ display: none; } document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow3').each(function(i){ $(this).click(function(){ $('.showclick3').eq(i).toggle(); $('.showclick2').eq(i).hide(); }); }); }); }); .clicktoshow3{ cursor: pointer; } .showclick3{ display: none; }
@NewinAI2 жыл бұрын
Decided to watch your most popular videos:) So this is the #6
@carocastillo70732 жыл бұрын
I have to come to thank you so much!! I had a hard time thinking how to make something like this cause I needed some sections to show after clics but hide if others were also clicked. And this guide me through it. Just made a little modifications and got the results I was looking for!! 5/5 stars!!! Excellet service! hahahahaha Thanks again :)
@ashishkumarmishra7412 Жыл бұрын
Hello Caro, I also want to implement the same feature you are telling about. Can you please help me with the code? It will very helpful.
@LocomotionDynamic Жыл бұрын
@@ashishkumarmishra7412 If Caro doesn't answer you, I may share the solution that I implemented, doing some minor additions to the shared code
@MarkusJue2 жыл бұрын
You are the best, really! So happy I found your chanel
@websquadron2 жыл бұрын
Wow, thank you!
@laurentregoning67362 жыл бұрын
Hi, I was wondering if you can help me figure out what I'm doing wrong. When I click the button, it brings me to the top of the page and the button disappears. The drop down section appears correctly though which makes me think it must be something minor. I'm wondering if the code was changed on the element site?
@websquadron2 жыл бұрын
Hi, the code hasn't changed. Have you got any menu anchors?
@sanaeareina53712 жыл бұрын
same Problem
@RohitVerma-wg4ko5 ай бұрын
Ohhh! I was looking for such thing or idea for a very time. I wanted to make check list for my website visitors and let them select options and create their own check list out of my given options. Thanks a lot brother 🙏🏻😘🤘
@websquadron5 ай бұрын
You're welcome 😊
@lemillie Жыл бұрын
Just what I needed, thank you so much!
@nicolenixxon Жыл бұрын
A similar problem occurred with my internet store. I utilized the ElementsReady Elementor Addons to aid me in trying to address the issue. I believe it could be beneficial for problem-solving as well.
@meisterleise2 жыл бұрын
This is very nice, but I miss a really important thing: the show & hide should be animated (slide up/down or something) otherwise it's in some situations hard for the visitor to understand what is going on there.
@websquadron2 жыл бұрын
A good point.
@juliancastaneda87752 жыл бұрын
@@websquadron How to do it? 🤔
@websquadron2 жыл бұрын
@@juliancastaneda8775 so you mean to make it slide up and down?
@juliancastaneda87752 жыл бұрын
@@websquadron Yes, smoothly.
@Freexpla Жыл бұрын
Absolute Legend! Exactly what I wanted!
@samsurrahmansaiel91032 жыл бұрын
Working Now. Thank you so much for the tutorial!
@WiperElite2 жыл бұрын
this code really works. thank you bro.
@_wargasipil4 ай бұрын
hi, Imran. Can it be implemented for icon list widget items, and containers? for example, list icon item 1 displays container 1. Thank you in advance.
@alisiblini8055 Жыл бұрын
Very helpful, but what if we need to add a Close tabs button at the end of all content in case the content is long in your case, we need to scroll up to beginning in order to (READ LESS)
@websquadron Жыл бұрын
Not sure about that
@holliswebb1800 Жыл бұрын
JOLLY GOOD INFORMATION
@CinthyaMariaGutierrezАй бұрын
Thank you. I did as you showed with a button that hide/show a form at the end of a page. When I click the button it hide/shows the form but it also takes me to the beginning of the page everytime. Is there a way to avoid this?
@pete-houghton9 күн бұрын
I followed the instructions aswell and got the same thing: one thing that Imran forgot to mention is to check the link for the button; and delete any contents... if there is a # sign in the button link, delete it; and it should work normally . the link should be blank. Also make sure the button css classes is the same as in your html and also the container, / section link css classes are the same in the html..
@gospelspreadnetwork85969 ай бұрын
hey this is very great, it worked very well, thank you very much.
@Liceclinicsofamerica2 жыл бұрын
You're amazing!! Thanks so much!
@TheOp0suM2 жыл бұрын
This helped a lot. Before I used HTML buttons, but they are annoying as all hell, because they are not elementor objects per se, so didn't sit well with different devices. This way works better and cleaner for sure!
@websquadron2 жыл бұрын
Great to hear!
@katod50569 ай бұрын
Thank you for this video! So helpful!! I like your style and the code worked (once found below hundreds of comments, many asking where is it.) Style wise, I'm wondering if there's transition animation code to make the show/hide less abrupt? Cheers!
@websquadron9 ай бұрын
I’m still trying to get a better way to modify the transition speed
@papayawebmedia Жыл бұрын
Great code! Thk very much but (here is always a but) how to change the tittle button like "Open" "Close" Thank again.
@anastasiasemeniuk7792 жыл бұрын
Thank you so much for the tutorial! The code works! However, I have the following issue: after clicking the button, the page jumps to top, kind of like when you use a "back to top" button, and the same happens when I click the button to hide the section. Is there a quick fix to this?
@websquadron2 жыл бұрын
Let me check
@parity60992 жыл бұрын
@@websquadron I have the same issue. Were you able to come up with a solution? Otherwise this code works perfectly and does what I've been trying to find in a while. Thanks!
@websquadron2 жыл бұрын
@@parity6099 I'm checking with the original coder
@pausesmana55312 жыл бұрын
Hello ! I found the problem ! The HTML was not the source of this. It's was the button itself ! Edit the button and go to it's "URL link" --> It has a "#" written in it ---> And this is the source of this evil scroll up :D
@raulhinojosa86212 жыл бұрын
@@parity6099 I found the solution... in the box of the button you are programming, there is a box where it says "link to", in there, is the "#" simbol by default.... The solution is to make it like this "#/" and there you go.... no more jumping around.
@JonaszOlszewski Жыл бұрын
Thank you so much. Big upgrade to my website!
@junah97603 жыл бұрын
I have tried on my popup template but, when i click the button, the section working fine and show, but my button dissapear :( . Whats wrong ?
@websquadron3 жыл бұрын
It shouldn't disappear that's for sure. Care to share the URL for the Page for the Popup?
@WARDS-STUDIO3 жыл бұрын
me too
@radektempka51802 жыл бұрын
Great, everything works.
@guidociabatti768411 ай бұрын
Hi, I show on click, but it doesn't hide when I click again
@leyo-lyth Жыл бұрын
Great video thanks but where is the code? There are 176 comments, do I scroll down to try and find it?
@websquadron Жыл бұрын
There’s a link in the video description to element.how
@noreinnathan Жыл бұрын
hey handsome, its works thank you so much... but everytime i click the button, itll gonna scroll / move up to the first section. is there anything i can do about that? its kinda annoying 😔
@websquadron Жыл бұрын
I may find a better solution for this soon
@noreinnathan Жыл бұрын
@@websquadron yes please 😔 thankyou so much 😁😁
@Rakib-786 Жыл бұрын
can you please make a separate video on that " route 2 is active and how to hide route 1? "
@olafk.50642 жыл бұрын
Thanks for your video! It worked great, but where and how can I put now an animation for the hidden and shown on click section? :)
@websquadron2 жыл бұрын
Let me check
@peterboyd54754 ай бұрын
Can you do this with Sharepoint?
@JoseMoralesOfficial Жыл бұрын
Awesome! So if I want a section to show up after a certain time I want, can we do this? For example, after 30 seconds a section with a form appears or whatever time frame I choose.
@websquadron Жыл бұрын
Best to check with the Code Developer, or put the code into ChatGPT and ask it to rewrite.
@albina272 Жыл бұрын
Hi great video thank you! -- I have a question that I need to solve soon for work please: For the toggle buttons (route 1 and route 2) what can you write in the code that it will always show route 1 unless route 2 is clicked, then it would be hidden. I want route 1 to show once the page loads unless the route 2 button is clicked. Thank you- much appreciated!
@albina272 Жыл бұрын
Nevermind- got it! For those wondering: just remove the following from the style. section: .showclick2{ display: none; }
@dansk9963 Жыл бұрын
Thank you. Is there a way to add an autoslide to next section/container on click? Each container is set to 100% vw and vh, so it would be cool, if one was taken to the next section without having to scroll.
@websquadron Жыл бұрын
Maybe with entrance animation… maybe…
@wizare16102 жыл бұрын
Great Vid! How would the code work if there's three routes and I want to only expand on one route and hide the other two? Thanks!
@websquadron2 жыл бұрын
Not so well there unless you carefully plan out the buttons. I’ll do an update on this soon.
@wilcowal2 жыл бұрын
I am trying to use one button to hide and show multiple sections. Can you tell me how to do that? Because I don't understand coding. Thank you in advance.
@websquadron2 жыл бұрын
That will require a little more effort and it may be better to use a toggle button instead?
@roberthausladen87 ай бұрын
You made my day. I like your style how you present such great thinks. Thanks a lot. But I have an issue with a show/hide section and I cannot solve it. May you help me here or know someone he/she can do? Thanks
@websquadron7 ай бұрын
Many thanks. Due to the high number of daily requests, I don’t investigate or propose possible solutions unless they're a 1-2-1 consultation. If you're still interested, visit my booking page: learn.websquadron.co.uk/#support
@danygingras77822 жыл бұрын
That is not working for me. Button disappear but section don't show up O.o
@websquadron2 жыл бұрын
Hi Dany. I need to reinvestigate this solution as this has been reported a few times.
@fredxperia48972 жыл бұрын
How to change the button content after a click? For example i want a button with lens icon, and after i click it and open the section, that button must turn in close icon. And then again if i close section clicking x, button became lens icon again.
@websquadron2 жыл бұрын
Let me have a think about that, as it needs to alternate.
Hello, it's a pity that you have not added the code with clicktoshow2 and 3 in your website snippet... Any way to send it please? Thanks
@websquadron2 жыл бұрын
I'll double check.
@julienwhatever57302 жыл бұрын
@@websquadron Wow, thanks so much for the quick response. That'd be great so we don't have to type everything manually from the end of your video.
@alexvaz5333 Жыл бұрын
Hi thank you for your contributions 😄 I'm not seeing the code in the comments. Has it been eliminated?
@websquadron Жыл бұрын
Hi It’s in the video description. element.how/elementor-show-section-on-click/
@alexvaz5333 Жыл бұрын
@@websquadron Thanks for your response. I followed the steps from the video and could replicate and understand it. Besides being useful, your videos are entertaining. Thank you for your work!
@MatthewVickersPhoto Жыл бұрын
OK Im giving this a try. I put the html code in and added my css classes. When I click the button the section shows up but the button disappears. What do I need to change in the code?
@websquadron Жыл бұрын
Best to contact the original code developer
@MatthewVickersPhoto Жыл бұрын
@@websquadron I figured it out. However, not sure if you cn help with this one. I have three buttons and threes sections. They all show up when I click each other buttons just fine. How can I make the other 2 disappear when I click on one of the buttons. Basically only want one to show at a time.
@MatthewVickersPhoto Жыл бұрын
@@Kelphaz I didn’t. I just found a way to only use a single button.
@michaelfrymus Жыл бұрын
When I click the button, the button dissapears and the items appear, so I am unable to click the button again to hike the section. I am also unable to open multiple sections at the same time. It only allows me to do one section. Is there a way to do this?
@websquadron Жыл бұрын
See this alternate version: kzbin.info/www/bejne/p5rSoJt6fLWlpLc
@anthonyherra7342 Жыл бұрын
Hi! I have a doubt. I have implemented this on my project and is doing fine. The problem is that when I click on the button it keeps "hovered" forever when the correct is that if I click a second time on this it shoud deactive the permanent hover and return to its regular shape. how can I deal with this?
@websquadron Жыл бұрын
Have you tried reaching out to the Code's Developer?
@depyrose Жыл бұрын
Very very helpful !!! Thank you so much! 😃
@AiForEveryMind10 ай бұрын
is it possible to do a filtering system with this please ? so if they click on a category it will only display that category
@websquadron10 ай бұрын
I suppose yes if the Loop Grid or Posts' query is set to be a certain category based on the 'click' bit.
@raulhinojosa86212 жыл бұрын
This is fantastic!!! Thank you so much... I have an issue, and I don't know why is happening... maybe you can help me... What I did, it was to use your code to hide a video, and then to be showed, only after clicking the button. It works like a charm!, but... every time I click the button, it takes the page back to the top... so I have to scroll down again to be able to find and see the (exposed) video... And actually, it doesn't matter if is to show or hide (the video).. As soon as I click the button, the page goes back to top. Any suggestions? Thanks in advance
@websquadron2 жыл бұрын
You may need to contact the original code developer - see the link - as I wonder if the code needs to be tweaked.
@raulhinojosa86212 жыл бұрын
@@websquadron Hi!.. Thanks for answering so soon... I figure out what was the issue. kind of silly, but it turns out that, because they are "buttons", and I didn't assign any link (in the "link to" box") they had the "#" sign by default in them, and because of that, it was sending the page back to the top everytime I clic. The solution for that was, to modify the "link form "#" to "#/", and now it works great, plus it looks fantastic. Once again, thanks for the video. I also want to thank you for the sample themes after me subscribing to your web, they are very interesting.
@adheltantao Жыл бұрын
Thanks for sharing! You deserve a like and subscribe!
@websquadron Жыл бұрын
Thanks for the sub!
@developertesting55342 жыл бұрын
How to implement Show and Hide this section with swipe (up and down) function? If I swipe up, it will move to the next section, and if I swipe down, it will return to the previous section ? Thanks
@websquadron2 жыл бұрын
That is beyond me, so I'll ask a colleague who came up with the code.
@developertesting55342 жыл бұрын
@@websquadron thank you very much I and I really appreciate it, I hope you can help me in finding the solution. 😀🙏
@websquadron2 жыл бұрын
@@developertesting5534 An alternative way is to make a Section appear as you scroll. Use the Scrolling Effect > Transparency. No code is required. See this video: kzbin.info/www/bejne/qX26k2uMedWWbKs In that video, I have applied to the images, but you could apply it to anything that you want.
@websquadron2 жыл бұрын
@@developertesting5534 And you have Scroll Snap too: kzbin.info/www/bejne/fqTKkIRpoamAf68
@developertesting55342 жыл бұрын
@@websquadron Is it possible?, because the problem is that i disabled scroll function in my project so that the page can't be scrolled. Therefore, I am looking for a solution to trigger the appearance of the section with a swipe up or swipe down touch.
@alesue6575 Жыл бұрын
Wonderful video very helpful,,,,,
@riccardostellati17472 жыл бұрын
The button disappears Thanks anyway
@muneer_md Жыл бұрын
Hey i am using the code as provided but when ever i use step 1, the image shows but (step 1 button ) disappears. Any suggestions what to do.
@websquadron Жыл бұрын
Have you seen my updated version of this video
@diptojakobbiswas Жыл бұрын
Why can't open the code after loging in to your website?
@websquadron Жыл бұрын
Sorry? No need to login to my website?
@wintershivering922 жыл бұрын
great content, very helpful. can i check what code to add in if i want one section to close automatically when i click another section.
@websquadron2 жыл бұрын
That would require more JS to be added to the script.
@alaeddinebelferrag302 жыл бұрын
@@websquadron can you make a video about that pls❤️
@LocomotionDynamic Жыл бұрын
If you still have the doubt on how to perform that action, I can show you what we did, emulating a Filter Menu, with 6 sections being toggled and just showing at least 01 section at a time, or letting the user to select more than one section and the other not selected being hidden. Even We understood so well the explanation in the video, that we cloned the clickable section, and one of the clickable section had a squared, and the other section had a square with a check, and being toggled both of the, one disappeared showing the section content and the other hidding the section content.👍👍👍
@bluehorizoncuracao89042 жыл бұрын
I'm experiencing the same problem as someone above here mentioned. Instead of a button I use a image box. And the section shows fine after clicking the button, however the image box disappears after clicking.
@websquadron2 жыл бұрын
The solution I found works well with a button.
@websquadron2 жыл бұрын
As long as you apply it that way, it will work. But to be fair, this is only one way of doing it, and there will be other methods using code.
@manavmht8353 жыл бұрын
Can we do the same with icon instead of button if yes then how to add two icons for example down icon to show the content and up icon to close the content also the up and down icon should be in same position
@websquadron3 жыл бұрын
The icons could be positioned side by side for sure, but then getting another icon to replace the previous is the bit that an experienced HTML expert could advise more. The code wouldn't need changing at all. All you need is for Icon 2 to hve a higher z-index than Icon 1 after clicking, and then for it to alternate between 1 and 2 each time there is a click.
@khairulanuar44522 жыл бұрын
Hi, when I click the button, the page goes to the top and the section did not appear. Can anyone assist me?
@websquadron2 жыл бұрын
Hi - did you follow the code and enter the correct classes for the buttons and the sections? The code works if you follow the steps. Email me on info@websquadron.co.uk if unsure
@khairulanuar44522 жыл бұрын
@@websquadron yes. It went to the top page each time I click the button and the section didn’t appear
@websquadron2 жыл бұрын
@@khairulanuar4452 It’s probably because you still have # showing as the link for the button. Click the button and go to the content tabard remove the # in the Link setting
@anselmagracesia2452 жыл бұрын
works man! thanks
@giogaming19932 жыл бұрын
Hello sir I have the same problem in the previous comment, when I click the button the page go up. how can I resolve it? Thank you in advance.
@websquadron2 жыл бұрын
Are you applying the exact same code?
@sanaahmed96442 жыл бұрын
Hi thank you for this. But i am having an issue, when the section appear on click it hides the button too. No option to close the section.
@websquadron2 жыл бұрын
Yup, it does hide. Let me check with the code developer.
@sanaahmed96442 жыл бұрын
@@websquadron yes please. I need this.
@דודשושני-ר2נ Жыл бұрын
I love u man u saved my ass big time ur the man keep it up 🫵🗿👌🏿🔥🔥🔥🥶
@Rakib-786 Жыл бұрын
brother, I'm not finding your code in the comment or link
@websquadron Жыл бұрын
The link is the description.
@ajitjadhav9040 Жыл бұрын
I had done it successfully with Elementor Form but once I submit the form , the form need to be Hided or Disappear how can I do that
@websquadron Жыл бұрын
I'm not sure about how to do that
@ajitjadhav9040 Жыл бұрын
@@websquadron ok fine
@bradleylambert32842 жыл бұрын
Could you have a dropdown with different options and depending on the option you choose it shows a certain product?
@websquadron2 жыл бұрын
I need to think about that.
@bradleylambert32842 жыл бұрын
@@websquadron That would be awesome if possible, to hide all sections with a certain product and depending on what they choose from a dropdown menu will depend on which section/product is displayed! Cheers mate.
@elcanaldejose28782 жыл бұрын
my containers won´t stay inline when being showed (but they are in line if the functions are not activated in the html code section) i try to display 3 sections in a line and it shows 3 lines instead
@websquadron2 жыл бұрын
Have you tried to set them with custom width?
@carolinecarol54553 жыл бұрын
Thank you very much! Helped me a lot 😀
@websquadron3 жыл бұрын
Awesome
@andreitoma6522 жыл бұрын
why disappear the button after i click it? the section appear, but the button disappear and I can't make the section disappear
@websquadron2 жыл бұрын
Did you apply the code as it should be. PS - you may need to check on the original site where the code came from. I know it works fine for me.
@ipamptinyhome2 жыл бұрын
Fantastic video subscribed. a copy of the code would have been great as the code I downloaded from the link was slightly different. button disappeared when pressed. works okay I'm happy.
@websquadron2 жыл бұрын
Maxime owns the code so I’ve got to keep it linked :) Hope it does enough for you.
@jarekwityk Жыл бұрын
Try this - line 7 must be .show(); this will prevent the button from disappearing after clicking document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow').each(function(i){ $(this).click(function(){ $('.showclick').eq(i).toggle(); $('.clicktoshow').eq(i).show(); }); }); }); }); .clicktoshow{ cursor: pointer; } .showclick{ display: none; }
@hassanjaved11472 жыл бұрын
How we can show the section sliding from left with transition ease??
@websquadron2 жыл бұрын
I’ll have a think about that. Slightly difficult because it’s already loaded
@hassanjaved11472 жыл бұрын
I will be waiting for the next video on this topic 😉
@brianwoodlief2 жыл бұрын
@@hassanjaved1147 @Web Squadron I got this easing animation to work... wherever "toggle" appears in code: .toggle('trans') add to .trans { -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
@morgane-almd Жыл бұрын
@@brianwoodlief Thank you for this ! It's not working for me, it's not moving. Just to know if i did it right, i put .toglle('trans')() in the code and on the bottom, before /style i add .trans { -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } this is it ?
@chrakesh51812 жыл бұрын
Hi bro...I think, I can get a solution from your video.. My requirement is designing calculator.. I need a text element and some button. When I click button, that clicked button should display in text element, exactly like calculator...please help me..just show code for one button, for the rest, I will do .please..
@websquadron2 жыл бұрын
That may require some JS writing. Best to get an expert coder.
@galovera8156 Жыл бұрын
Love it!!
@edberaga2 жыл бұрын
hahaa you a good lecturer, very fun and funny
@websquadron2 жыл бұрын
:)
@edberaga2 жыл бұрын
@@websquadron I think I need help, ussually once I press the button suddenly the webpage went to the header section. And the section did appear but the button dissapear even if I use .toggle(),,
@websquadron2 жыл бұрын
@@edberaga Are you using the same code? We could offer 1-2-1 support, but we do charge for that. Email on info@websquadron.co.uk
@Chineseculture3612 жыл бұрын
I do not see clearly where you get that HTML code ?
@websquadron2 жыл бұрын
There is a link to the code in the description
@banjoriconsulting62402 жыл бұрын
Hi, How are you doing today? Excellent video very informative. I followed the video & to large extent I successful however at the frontend of the site things did not work the way I wanted it to. Please can you assist me in fixing this/
@websquadron2 жыл бұрын
I've replied to you email. Difficult to clarify without knowing how the site is built.
@sabahraffik32863 жыл бұрын
Hei bro this is mazing! But I still not seen the cod ? Where is it?
@websquadron3 жыл бұрын
It was in the comments :) Here you go: Code :) document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow').each(function(i){ $(this).click(function(){ $('.showclick').eq(i).toggle(); $('.clicktoshow'); }); }); }); }); .clicktoshow{ cursor: pointer; } .showclick{ display: none; } ------ The above is fine on it's own, but below can go a step further. document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow2').each(function(i){ $(this).click(function(){ $('.showclick2').eq(i).toggle(); $('.showclick3').eq(i).hide(); }); }); }); }); .clicktoshow2{ cursor: pointer; } .showclick2{ display: none; } document.addEventListener('DOMContentLoaded', function() { jQuery(function($){ $('.clicktoshow3').each(function(i){ $(this).click(function(){ $('.showclick3').eq(i).toggle(); $('.showclick2').eq(i).hide(); }); }); }); }); .clicktoshow3{ cursor: pointer; } .showclick3{ display: none; }
@riggsssss2 жыл бұрын
Hey! Great content tbh, you deserve much more! I had a question, this effect is kinda cool but I'd like to know how to make it with fade out and fade in effect Thaanks
@websquadron2 жыл бұрын
Sure, that is something we're trying to figure out. Some Transition could be added,, maybe.... transition: 0.5s ease-in-out;
@jessforerorodriguez2466 Жыл бұрын
Hello, how it can works if are 3 columns?
@websquadron Жыл бұрын
Can still work as it’s based on sections
@kingsolomon29482 жыл бұрын
Please help me, what if I want to show the hidden section using swipe, or according to the touch direction?
@websquadron2 жыл бұрын
Not sure about swipe sorry. Maybe try to make it work with column hover instead?
@kingsolomon29482 жыл бұрын
@@websquadron oke thankyou 😀👍
@phamminhthong-marketing65092 жыл бұрын
how can i get the code please, it too long to remember and type.
@websquadron2 жыл бұрын
Go to the Link, and then copy and paste it :)
@OutCube2 жыл бұрын
Any way to do this for new container :) I'm waiting for a video from you :) thank you for the great Chanel
@websquadron2 жыл бұрын
Soon. Working on a solution for it.
@onurc.karaca90312 жыл бұрын
is there a way to trigger these tabs thru link? like a link to go to second tab
@websquadron2 жыл бұрын
Not sure about that unless some extra JS was applied
@johnboyd80533 жыл бұрын
Thanks, Imran! This is exactly what I need for a website I've built and was having an issue with. However, you haven't shared the code you were using in the comments. At least, I don't see them.
@websquadron3 жыл бұрын
Hi John :) It should be in the comments. I’ll email it to you if it’s not showing for some reason.
@johnboyd80533 жыл бұрын
Hi Imran, You are correct, it is showing in the comments. For some reason, one of the sort filters was obscuring it from my view. But, I do see it now!
@websquadron3 жыл бұрын
@@johnboyd8053 :)
@aytac.korkusuz Жыл бұрын
It would be better if you explained a section button that can be hidden as +/-.
@caslanti2 жыл бұрын
great video thanks
@websquadron2 жыл бұрын
Glad you enjoyed it
@nitromaroc2 жыл бұрын
Very helpful 👏👏👏👏 thanks 😊
@websquadron2 жыл бұрын
You're welcome 😊
@anushasreerama4683 Жыл бұрын
Hi where can I find the code..?
@websquadron Жыл бұрын
The link is in the video description.
@ggiavasis Жыл бұрын
This code is great thank you! Im using it to create a type of custom tabbed section. I need a tip though. Currently I have two colums of buttons, and each one shows a different content section (and hides all the other sections). I would like the first button's item to already be displayed when the user scrolls down to this element. Right now, a button needs to be clicked to show the first content section. AND along those lines, I would like to change some code so that one tab is always showing. In otherwords, is there anyway to make this code function a little more like a custom "Tabs" element?
@HelloyeloNo12 жыл бұрын
Thank youk that worked
@HelloyeloNo12 жыл бұрын
Is there any way that we can have it ease out when you click the button? ATM the transition is quite harsh when you click the "show button". TIA
@buzznetwork Жыл бұрын
Does this work with containers?
@websquadron Жыл бұрын
I have an updated version: kzbin.info/www/bejne/eqTUYq2Poa16jLs
@rehmankureshi2 жыл бұрын
not able to see the code :(
@websquadron2 жыл бұрын
Click the link in the description and then use Google to access
@asepridwan30772 жыл бұрын
hey bro, its amazing.... i subscribe directly... show your another content oke...
@websquadron2 жыл бұрын
Thanks
@Playafat2 жыл бұрын
Thank you
@websquadron2 жыл бұрын
You're welcome
@rimonchowdhury12893 жыл бұрын
Great!
@samsurrahmansaiel91032 жыл бұрын
I can't work.
@websquadron2 жыл бұрын
Was the code entered correctly and did you watch without skipping?