Page History

...

Section

Column

HTML

<div class="container">
  <!--start CssMenu-->
  <div id="cssmenu">
    <ul>
      <li>
        <span>About ETCLC <i class="arrow"></i></span>
        <ul class="dropdown">
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/End+Stage+Renal+Disease+Treatment+Choices+Learning+Collaborative?preview=/202386541/209161617/ETCLC%20Recruitment%20Talking%20Points_FINAL2.pdf">FAQ's</a></li>
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/beta1?preview=%2F517474114%2F537232798%2FETCLC+Committment+for+Results+10.27.21_fillable-2-10-23.pdf">Learn More</a></li>
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/National+Faculty">National Faculty</a></li>
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/LCC#">Leadership Coordinating Council</a></li>
          <li><a href="https://etclc.healthcarecommunities.org/">ETCLC Progress Tracking System</a></li>
        </ul>
      </li>
      <li>
        <span>Participating Organizations <i class="arrow"></i></span>
        <ul class="dropdown">
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/opo">Organ Procurement Organizations</a></li>
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/transplant+centers">Transplant Centers</a></li>
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/donor+hospitals">Donor Hospitals</a></li>
        </ul>
      </li>
      <li>
        <span>Resources <i class="arrow"></i></span>
        <ul class="dropdown">
          <li><a href="https://qnetconfluence.cms.gov/display/ETCLC/Change+Packages">Change Packages</a></li>
          <li><a href="https://app.powerbi.com/view?r=eyJrIjoiMmJmMDMyYjktNTVmNS00ZDBmLWE4NDAtNjVlNWU3OThmNzE4IiwidCI6Ijc0MjZkZWJmLWQ4MDItNDFkMi05ZGJjLTJjNjk0YmRlYjZmZiIsImMiOjF9">National Dashboard</a></li>
        </ul>
      </li>
      <li>
        <span>Patient and Donor Family <i class="arrow"></i></span>
        <ul class="dropdown right0">
          <li><a href="https://donateliferegisterme.netorg/#">Your>Become Information | Donate Life America (registerme.org)<a Donor</a></li>
        </ul>
      </li>
    </ul>
    <!--end CssMenu-->
  </div>

...

Section

CSS Stylesheet
.confluenceTh, .confluenceTd { background-color: #FFFFFF !important; border: 0px none #FFF; } .confluence-embedded-image { cursor: none !important; }

Section

HTML

<div class="hwrap">
  <div class="hmove">
    	<div class="hitem">February>April 14th is National Donor Day!<Donate Life Month</div>
	<div class="hitem">April is National Donate Life Month</div>
<div class="hitem">CMS>Save the date for the upcoming in-person events at Quality Conference, is April 8-10th, 2024<, Baltimore, MD, and NKF, May 17th, Long Beach, CA.</div>
  </div>
</div>

CSS Stylesheet

 /* (A) FORCE ALL ITEMS INTO SINGLE ROW */
 .hmove {
   	display: flex;
	white-space: nowrap;
 }

 .hitem {
   width: 100%;
   flex-shrink: 0;
   font-size: 21px;
   font-family: Verdana, sans-serif;
 }

 .hwrap {
   overflow: hidden;
   padding-bottom: 15px;
 }

 /* (B) MOVE ITEMS FROM RIGHT TO LEFT */
 /* first item = 0, fourth item = -300% */
 @keyframes tickerh {
   0% {
     transform: translatex(100%);
   }

   100% {
     transform: translatex(-260%200%);
   }
 }

 .hmove {
   animation: tickerh linear 40s infinite;
 }

 .hmove:hover {
   animation-play-state: paused;
 }

 @media only screen and (min-width: 200px) and (max-width: 600px) {
   .hmove {
     animation: tickerh linear 30s infinite;
   }
 }

 @media only screen and (min-width: 601px) and (max-width: 1000px) {
   .hmove {
     animation: tickerh linear 30s infinite;
   }
 }

...

Page tree

Versions Compared

Old Version 204

New Version Current

Key