Menu icon Foundation

My Posts


My Comments

Random Freeform commented on Cristyan J. Moreno's post almost 3 years

Cool beans Bruno! 
Will try this in a few days and report.

Random Freeform commented on Cristyan J. Moreno's post almost 3 years

Cool beans Bruno! 
Will try this in a few days and report.

Random Freeform commented on Cristyan J. Moreno's post about 3 years

I need a solution too!..
though trying to pause vimeo on modal close

Random Freeform commented on Jeremy Englert's post over 3 years

Yay!!!!!!

Random Freeform commented on Matthew Hargraves's post about 4 years

Hmmm, I too don't see the header image on my latest install of Foundationpress.
I see it on an install I made a month or so ago though..
Is there something we're suppose to do - maybe this custom-header is a new thing?
Thanks for help!

Random Freeform commented on ayezee's post about 5 years

Got it...
Doh, it was sitting there just above my request.

.top-bar-section ul li.active > a {
background: #ffffff !important;
color: black !important;
}

(Thanks everyone, this is useful stuff until I/we find time to embrace sass.)

Random Freeform commented on ayezee's post about 5 years

I'm looking to change the 'active' menu item..

(typically blue by default)
Thanks for any tips!...

Random Freeform commented on Random Freeform's post about 5 years

Here's the code 'working' at http://codepen.io/ZsharE/pen/FenKC
Yea!!
Odd that taking off the single quotes breaks it though.

Random Freeform commented on Random Freeform's post about 5 years

BTW, the code I'm using above is being used in a Reverie Foundation Wordpress site ..
which might be my main problem. Just curious if it the right code to try to use.

Random Freeform commented on Random Freeform's post about 5 years

I found help elsewhere that gave the below solution...
but for some reason it's still not working for me...
Any thoughts if this all looks right??
THX!!!!!!


<style>
.example-orbit-content li div {
    color: white;
    background: #0F1D24;
    padding: 30px 40px; }

.example-orbit-content li div h1, .example-orbit-content li div h2, .example-orbit-content li div h3 {
    color: white;
}
</style>

<div class="row">
    <a href="javascript:;" id="play" class="tiny button">Play</a>
    <a href="javascript:;" id="pause" class="tiny button">Pause</a>
    <a href="javascript:;" data-orbit-link="headline-1" id="#stop" class="tiny button">Stop</a>
</div>

<!-- slider -->
<div class="row">
    <div class="large-6 columns">
        <ul id="featured" class="example-orbit-content" data-orbit>
          <li data-orbit-slide="headline-1">
            <div>
              <h2>Headline 1</h2>
              <h3>Subheadline</h3>
            </div>
          </li>
          <li data-orbit-slide="headline-2">
            <div>
              <h2>Headline 2</h2>
              <h3>Subheadline</h3>
            </div>
          </li>
          <li data-orbit-slide="headline-3">
            <div>
              <h2>Headline 3</h2>
              <h3>Subheadline</h3>
            </div>
          </li>
       </ul>
   </div>      
</div>




<script>
    $(document).foundation({
        orbit: {
            animation: 'fade',
            timer: true,
            timer_speed: 500,
            timer_paused_class: 'slider-pause',
            slide_number: true,
            pause_on_hover: false,
            animation_speed: 500,
            navigation_arrows: true,
            variable_height: false,
            bullets: false
        }
    });

    $(".orbit-timer").click();

    $('#play').on('click', function(){
        $("#featured").siblings(".slider-pause").click();
    });

    $("#pause").click(function() {
        $("#featured").siblings(".orbit-timer").click();
    });

});
</script>

Posts Followed






Following

    No Content

Followers

My Posts

My Comments

You commented on Cristyan J. Moreno's post almost 3 years

Cool beans Bruno! 
Will try this in a few days and report.

You commented on Cristyan J. Moreno's post almost 3 years

Cool beans Bruno! 
Will try this in a few days and report.

You commented on Cristyan J. Moreno's post about 3 years

I need a solution too!..
though trying to pause vimeo on modal close

You commented on Jeremy Englert's post over 3 years

Yay!!!!!!

You commented on Matthew Hargraves's post about 4 years

Hmmm, I too don't see the header image on my latest install of Foundationpress.
I see it on an install I made a month or so ago though..
Is there something we're suppose to do - maybe this custom-header is a new thing?
Thanks for help!

You commented on ayezee's post about 5 years

Got it...
Doh, it was sitting there just above my request.

.top-bar-section ul li.active > a {
background: #ffffff !important;
color: black !important;
}

(Thanks everyone, this is useful stuff until I/we find time to embrace sass.)

You commented on ayezee's post about 5 years

I'm looking to change the 'active' menu item..

(typically blue by default)
Thanks for any tips!...

You commented on Random Freeform's post about 5 years

Here's the code 'working' at http://codepen.io/ZsharE/pen/FenKC
Yea!!
Odd that taking off the single quotes breaks it though.

You commented on Random Freeform's post about 5 years

BTW, the code I'm using above is being used in a Reverie Foundation Wordpress site ..
which might be my main problem. Just curious if it the right code to try to use.

You commented on Random Freeform's post about 5 years

I found help elsewhere that gave the below solution...
but for some reason it's still not working for me...
Any thoughts if this all looks right??
THX!!!!!!


<style>
.example-orbit-content li div {
    color: white;
    background: #0F1D24;
    padding: 30px 40px; }

.example-orbit-content li div h1, .example-orbit-content li div h2, .example-orbit-content li div h3 {
    color: white;
}
</style>

<div class="row">
    <a href="javascript:;" id="play" class="tiny button">Play</a>
    <a href="javascript:;" id="pause" class="tiny button">Pause</a>
    <a href="javascript:;" data-orbit-link="headline-1" id="#stop" class="tiny button">Stop</a>
</div>

<!-- slider -->
<div class="row">
    <div class="large-6 columns">
        <ul id="featured" class="example-orbit-content" data-orbit>
          <li data-orbit-slide="headline-1">
            <div>
              <h2>Headline 1</h2>
              <h3>Subheadline</h3>
            </div>
          </li>
          <li data-orbit-slide="headline-2">
            <div>
              <h2>Headline 2</h2>
              <h3>Subheadline</h3>
            </div>
          </li>
          <li data-orbit-slide="headline-3">
            <div>
              <h2>Headline 3</h2>
              <h3>Subheadline</h3>
            </div>
          </li>
       </ul>
   </div>      
</div>




<script>
    $(document).foundation({
        orbit: {
            animation: 'fade',
            timer: true,
            timer_speed: 500,
            timer_paused_class: 'slider-pause',
            slide_number: true,
            pause_on_hover: false,
            animation_speed: 500,
            navigation_arrows: true,
            variable_height: false,
            bullets: false
        }
    });

    $(".orbit-timer").click();

    $('#play').on('click', function(){
        $("#featured").siblings(".slider-pause").click();
    });

    $("#pause").click(function() {
        $("#featured").siblings(".orbit-timer").click();
    });

});
</script>

Posts Followed

Following

  • No Content

Followers

  • No Content