Menu icon Foundation

Designer

My Posts

  • NEW
  • Menu goes mad on flex grid???

    By Sasha Beep

    flexboxgridtopbarmenu

    Guys, what the hell is going on with mu menu? I just want to menu gets 100% width if the screen are amaller then large... No problem with that on default grid, but on the flex grid is total madness!!! Having issues with medium. Top bar items is shrinking... (continued)







My Comments

Sasha Beep commented on Peter Moore's post over 2 years

Same issue here, did you solved it?

Sasha Beep commented on Sasha Beep's post over 2 years

I've added a set of layout classes to HTML tag like so:
addded to app.js
$(document).foundation();

function setBodyQuery(){
var viewport = "size-" + Foundation.MediaQuery.current;
$('html').removeClass("size-xxlarge size-xlarge size-large size-medium size-small");
$('html').addClass(viewport)
}

//pass css viewport class on resize
$(window).on('changed.zf.mediaquery', function(event, newSize, oldSize) {
setTimeout(setBodyQuery(), 50)
});

$(document).ready(function () {

//pass css viewport class
setBodyQuery();

//EODR

});

Sasha Beep commented on Sasha Beep's post over 2 years
Sasha Beep commented on Sasha Beep's post almost 3 years

Looks like this is it :)

Sasha Beep commented on Sasha Beep's post almost 3 years

How to pass current viewport state (small, medium,large...) as class to HTML tag using foundation js?
to avoid re-using media queries like
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
background: green;
}
to
html.medium #myelement{
background: red
}
because from time to time breakpoints can be various depending on max-width of foundation build
 

Sasha Beep commented on Sasha Beep's post almost 3 years

Thanks, Ryan but this is not what i'm searching for.
i need a function similar to $.fn.colorbox.resize() in Colorbox plugin which can be fired manually. For example for ajax purposes when newly added content is taller than previous in modal box

Posts Followed

  • 2
    Replies
  • spotSwipe

    By Peter Moore

    spotswipe

    Hi, I'm trying to use spotSwipe with the code; $('#outer').spotSwipe().on('swipeleft', landingLeft()); but I'm getting an error  TypeError: $('#outer').spotSwipe is not a function. (In '$('#outer').spotSwipe()', '$('#outer').spotSwipe' ... (continued)

    Last Reply by Trauquen about 2 years ago


Following

    No Content

Followers

My Posts

My Comments

You commented on Peter Moore's post over 2 years

Same issue here, did you solved it?

You commented on Sasha Beep's post over 2 years

I've added a set of layout classes to HTML tag like so:
addded to app.js
$(document).foundation();

function setBodyQuery(){
var viewport = "size-" + Foundation.MediaQuery.current;
$('html').removeClass("size-xxlarge size-xlarge size-large size-medium size-small");
$('html').addClass(viewport)
}

//pass css viewport class on resize
$(window).on('changed.zf.mediaquery', function(event, newSize, oldSize) {
setTimeout(setBodyQuery(), 50)
});

$(document).ready(function () {

//pass css viewport class
setBodyQuery();

//EODR

});

You commented on Sasha Beep's post over 2 years
You commented on Sasha Beep's post almost 3 years

Looks like this is it :)

You commented on Sasha Beep's post almost 3 years

How to pass current viewport state (small, medium,large...) as class to HTML tag using foundation js?
to avoid re-using media queries like
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
background: green;
}
to
html.medium #myelement{
background: red
}
because from time to time breakpoints can be various depending on max-width of foundation build
 

You commented on Sasha Beep's post almost 3 years

Thanks, Ryan but this is not what i'm searching for.
i need a function similar to $.fn.colorbox.resize() in Colorbox plugin which can be fired manually. For example for ajax purposes when newly added content is taller than previous in modal box

Posts Followed


Following

  • No Content

Followers

  • No Content