Card-Expandable open issue

Hello, Can someone please help with this? I want to prevent card-expandable to open popup, when i click on a button in card-expandable section. I am trying below but no luck. Code is as bellow

    <div class="card card-expandable" style="width:100%;margin-left:0px">
        <div class="card-content">
          <div class="bg-color-white" style="height: 300px;">
            <div class="card-header text-color-black display-block">
              Framework7
              <br>
              <small style="opacity: 0.7">Build Mobile Apps</small>
              <button class="col button button-fill color-blue">BUTTON</button>

            </div>
            <a href="#" class="link card-close card-opened-fade-in color-black" style="position: absolute; right: 15px; top: 15px">
              <i class="icon f7-icons">close_round_fill</i>
            </a>
            <p class="card-opened-fade-in">THIS IS TEXT SHOULD SHOW ONCEW IT IS OPEN</p>
          </div>
          <div class="card-content-padding">
            <p>Framework7 - is a free and open source HTML mobile framework to develop hybrid mobile apps or web apps with iOS or Android (Material) native look and feel. It is also an indispensable prototyping apps tool to show working app prototype as soon as possible in case you need to.</p>
            ...
          </div>
        </div>
      </div>

–Java Script–
$$(’.button’).on(‘click’, function() {
cardBeforeOpen(".card",prevent);
});

Not easy right not, will add such feature in next update

Thanks for the update.

I can’t seem to get expandable cards to work at all, when i drop in the sample code the card is already expanded - am i missing something? I just updated to V 4.4.
Capture
Thanks!
Sal!

Do you have a live example of the issue? You are doing something wrong.

it looks like user issue, thanks for the response. I need to review my code some more