zurb-foundation

Foundation 6 Orbit: Change Slide programatically

隐身守侯 提交于 2020-01-07 02:14:21
问题 On Foundation 6. I have an orbit slider that, besides the default behaviour, it also needs to be able to change the slide when an outside button is clicked. Is there a way to make this work? I've tried this code: jQuery('#theslider').foundation('changeSlide', true, slide_id); //slide_id is the jQuery object's slide ex: jQuery(#slideid); It kind of works, but it works erratically. It sometimes works fine for a while, but a some point then the slide goes fast and disappears from the screen, or

off canvas navigation foundation hook up problems

旧时模样 提交于 2020-01-06 13:25:50
问题 I am having trouble hooking up the off canvas navigation for foundation 5. It is not displaying the list and the tab bar jumps down a few margin when off canvas navigation is active. Here is my html markup: <div class="marketing off-canvas-wrap"> <div class="inner-wrap"> <!-- --> <div class="fixed"> <nav class="top-bar docs-bar hide-for-small" data-topbar> <ul class="title-area"> <li class="name"> <h1><a href="index.html">website</a></h1> </li> </ul> <section class="top-bar-section"> <ul

Sprockets::FileNotFound with ZURB Foundation

℡╲_俬逩灬. 提交于 2020-01-06 01:22:25
问题 When using foundation 4.3.1 on Rails 3.2 I get the following error: Sprockets::FileNotFound in Refinery/pages#home Showing ...../gems/refinerycms-92675b5132ae/core/app/views/refinery/_javascripts.html.erb where line #16 raised: couldn't find file 'foundation' (in ...../app/assets/javascripts/application.js:15) I checked everything, assets are turned on, downgraded to an earlier version of Foundation. But nothing works like it should (I have the same thing running fine with a different Rails

Rails - how to link to assets outside the app directory

心已入冬 提交于 2020-01-05 08:56:07
问题 I'm brand new to Rails. I installed the Zurb foundation front-end framework as described here: http://www.zurb.com/article/814/yetify-your-rails-new-foundation-gem-and- When I open app/assets/stylesheets/application.css I find this auto-generated code: /* * This is a manifest file that'll automatically include all the stylesheets available in this directory * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at * the top of the compiled file,

Zurb Foundation Sticky Footer

偶尔善良 提交于 2020-01-04 13:40:52
问题 I want to have sticky footer using Foundation 4, and I want to use HTML5 <footer> tag, not <div class="footer"> . Also I just don't want to change the foundation.css, not to break it other parts of the framework. I tried http://tangerineindustries.com/download/sticky_footer/ but it doesn't work on Chrome and IE 10. Any suggestion how to achieve it, either css only or js? Is it possible to do it only changing app.css and/or app.js? 回答1: This post explains my favorite method, using CSS only.

How To Initialize Foundation 3 To Use Orbit?

我们两清 提交于 2020-01-04 02:02:27
问题 I am trying to use a script I found in this question to run Orbit in Foundation 3, but I can not get it to initialize properly. I added this script in the footer and Foundation.min.js in the header. I get a no method 'foundation' error on line 3 in my console it doesn't work. 回答1: The script in that SO thread you linked to will not work for your because it uses Foundation 4. Orbit is initialized differetly in Foundation 3 (F3). So suppose you have an element with id orbitX . You initialize it

Foundation 6 Off-canvas menu auto-close after click

老子叫甜甜 提交于 2020-01-04 01:37:45
问题 I've been searching how to auto-close off-canvas menu after some menu item is clicked but nothing seems to work. So I followed guide on how to make off-canvas menu on Foundation 6 docs and it works. This part is okay. Now when I click on some link menu just stays there and I want it to close. Does anyone know how to fix that. I've found snippet that should do the trick but my menu stops showing after I appy this JS. Others report the same problem. $(document).foundation({ offcanvas : { open

Foundation 4:Unable to overwrite its regular expression to validate password

大憨熊 提交于 2020-01-03 02:27:15
问题 I want to overwrite password pattern provided by foundation(zurb) but its not identifying my overwritten regular expression and generated error according to its by default expression. By default,passwords validation provided by foundation is "must be at least 8 characters with 1 capital letter, 1 number, and one special character". For that I have used following: 1) <head> <script> $(document) .foundation() .foundation('abide', { patterns: { new: ^[a-zA-Z]\w{3,14}$, } }); </script></head>

Add text overlay to panel and image with Zurb Foundation?

自作多情 提交于 2020-01-02 14:32:36
问题 I am not new to programming but I am new to Zurb Foundation and am using Foundation 5. I have some simple panels that consist of image and text below. Does Foundation have the capability to add a text overlay to a picture? Of course, I could integrate the text into the picture, but I'd like to be able to quickly swap it out. Is there a way to just overlay it? This is what I have now <div class="large-3 small-6 columns"> <img src="mypic.jpg" /> <h6 class="panel"><strong>My Pic Description<

Zurb Foundation Interchange not working, 'nodeName' undefined

∥☆過路亽.° 提交于 2020-01-02 07:18:30
问题 I'm trying to use interchange to change images based on the screen size. However, when interchange is initialised no images load. Then when I resize the browser (1024px and lower) I get an error in the console saying: Uncaught TypeError: Cannot read property 'nodeName' of undefined Which relates to line 47 of foundation.interchange.js, which is: if (/IMG/.test(el[0].nodeName)) { The code I'm trying to use is: <img data-interchange="[http://www.example.com/image.png, (default)], [http://www