Jump to content

Markdown menu that opens when hovering above the text.

Recommended Posts

Site URL: https://greyhound-sheep-7z4x.squarespace.com/om-oss-2

Hi!
How do I keep a markdown menu open while I'm moving the cursor inside the markdown box. 
I just watch this video on how to make a accordian styled dropdown menu, which I made with the markdown button. 
I used some HTML and CSS + code inside of the markdown. 

Here is the HTML code: 

 

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script>
    $(document).ready(function(){
    $('.markdown-block .sqs-block-content h3').addClass('ui-closed').css('cursor','pointer');
    $(".markdown-block .sqs-block-content h3").nextUntil("h3").slideToggle();
    $(".markdown-block .sqs-block-content h3").hover(function() {
      
      $(this).nextUntil("h3").slideToggle();
      $(this).toggleClass('ui-closed ui-open');
      });
    });
    </script> 

And my CSS: 
 

#block-yui_3_17_2_1_1646131305524_2175{ 
  font-size: px;
 left: -1740px;  
 bottom: 980px;
  

#block-yui_3_17_2_1_1646131218070_4998{ 
  font-size: px;
 left: px;  
 bottom: 120px;
 

  

Password for the website is: test123 

So my first question is does anybody know how I could keep the markdown menu open while browsing around with my cursor in the dropdown menu? 

My second question is how do I stop the accordian styled menu from pushing down the content that is below it.
For example if I hove above the "Tiego" text content inside of that menu pushes the text "Jobba hos oss" further down the page, is there a way to stop it from doing that? 

All the tips are welcomed!

/Tonton
 

Markdown.png

Edited by tonton
Miss click, early post.
Link to comment
  • Replies 1
  • Views 568
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Create an account or sign in to comment

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


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.