Menu icon Foundation

My Posts









  • 3
    Replies
  • Invoke Foundation?

    By Sherry Bradford

    Foundationjs

    I have to add a bunch of shivs (thankfully found on this site and working really well!!!!) to make my Foundation-based site work on IE11 in compatibility view (10/9). While learning and getting all the shivs in place, one of the folks included the followi... (continued)

    Last Reply by Sherry Bradford about 1 year ago



My Comments

Sherry Bradford commented on Christian Cruz's post 12 months

I ended up having to create a totally separate css file for the top-bar. My pages are buried deep behind several layers of corporate css so we always have issues with downstream impacts on foundation css. In some cases, I had to go the hellish route of putting the style right into the page. I definitely do not recommend that - but in some cases there simply was no other solution. Fortunately our total number of pages with the top-bar nav is low so it isn't as horrible as it would be in a major web environment.

Sherry Bradford commented on Sherry Bradford's post about 1 year

I found a "partial" solution. I had two versions of jquery in my code. I don't know enough about jquery to be able to troubleshoot very well, but I did work in the Chrome browser developer areas and found that one of those jquery files was behaving badly with the overall site theme (not controlled by me) and throwing an error. I removed the jquery causing the issue and that allowed the menu links to all work. It had some other minor impacts when I removed it, but all my primary foundation code worked OK (things like the accordion, sliders, etc.)
Insofar as the image, I had a "hero" style background image with an overlay of text that we change often. I tried different things with updating that area and ultimately went with just a straight banner image rather than hero and made the text part of the banner. That isn't a good solution for us but it did resolve the issue. My expectation is that, if I knew enough about jquery and javascript and CSS, I could have found a solution. I'm fair at CSS and javascript, but know nothing about jquery.
This menu is a temporary need for us so after spending two days getting it to work and deploying across multiple pages, I'm going to have to be happy with it working "as is". I suspect my question will not get other replies as it is about Foundation 5 and top-nav - and so many people have moved on to Foundation 6 and more refined nav options. But I'm grateful for the resources here and ultimately some of those helped me to find a way to work around this at least!
 

Sherry Bradford commented on Sherry Bradford's post about 1 year

Rafi - are these two statements doing the same thing?
$(document).ready(foundation)();
AND
$(document.foundation();
 
 

Sherry Bradford commented on Sherry Bradford's post over 1 year

LOL - no, we are a huge, modern airline and it is our corporate intranet for employees. There are hopes it will move off IE8 in the next year, but in the meantime this one particular "corner" of the intranet was redesigned to take advantage of whatever we could squeeze out of IE8. To add to the overall dilemma, we are built on frames as well. Foundation was a godsend in the effort to redesign this section and we get lots of compliments on usability.

Thank you for the post and I'll read up on the no.conflict mode info you provided and see if we can get past this one issue. I did learn the other day that IBM frames and IE8 have trouble with allowing links to open inside the page as you descend further into the navigation structure. The individual explaining this didn't have much detail to share, so I'm going to test out the no.conflict first. If that doesn't work, I'll investigate the nav level further.

I'm going to be so well trained on how to overcome IE8 issues that I fear I will never really get to enjoy working in a truly modern browser! Sigh.....

Sherry Bradford commented on Sherry Bradford's post almost 2 years

@Clifton Canady Well, would that the world were perfect, but alas 'tis not. I work for a major airline and our corporate intranet is on IE8 - and likely will be for at LEAST another 6 months. And we are not alone in the corporate world, unfortunately. Our intranet itself could easily "flip the switch" and be on IE11 - but we host numerous applications whose interfaces will not function within IE8 - and thus we have to wait for money/time to be spent for them to change before we can do so. I'm just DELIGHTED that my little corner of the intranet at least gets to work with HTML5/CSS3 to the extent possible.

Sherry Bradford commented on Sherry Bradford's post about 2 years

BITTEN BY IE8 AGAIN!!!!

This makes me crazy. The environment in which I must develop is set up for IE11 ONLY (don't EVEN get me started on how insane this is). But our actual environment is IE8. So adding position:absolute works great in IE11 - but will not work at all with IE8 (i have a gazillion shivs already taking care of just about everything possible and they aren't helping with this).

So IE8 is completely ignoring the position:absolute, doesn't line up to the left and so doesn't apply any of the left/top alignment.

AARGHHHHH......

Sherry Bradford commented on Sherry Bradford's post about 2 years

You ROCK! Thank you!

Sherry Bradford commented on James Cocker's post about 2 years

Jordi - I have not tried with 5.5. I am using 5.2 and I found that it was very important WHERE I put the shivs and the items at the close of the page AND it was also very important that I use IF lte IE 8 and not just IF lt IE9. IE 9 seems to work OK with most of the things I needed to do - and for whatever reason, my shiv statements were being ignored until I switched to lte IE 8. I also had to put the respond.min.js up right under the last css in the head for it to work correctly. I hope that helps and perhaps is something you can try to see if it helps with 5.5. What are you trying to accomplish with the css? Just the grid or something more spectacular? So far I have been able to get pretty much everything to work that I have tried - but again my site is not super complicated. Some elements I use in addition to the grid functionality are cards, slider, and getting ready to add the accordion feature. Responsive works to the level that I am able to correctly set up the grid - but that is more user error/lack of skills than the tool so far.

Good luck! If you need to see how I laid out my header and shivs, and what I put at the end before the close, I'll be happy to post those.

Sherry Bradford commented on Sherry Bradford's post about 2 years

Thank you! Needless to say, will be sooooo glad when we move off IE8.....

Sherry Bradford commented on Sherry Bradford's post about 2 years

Thank you!!!! Appreciate the very quick response. You ROCK!

Posts Followed

  • 3
    Replies
  • Styling the top bar

    By Christian Cruz

    Hello everyone, I am styling the top bar and I was wondering how to change the background color of the <a> element when navigating the dropdown menu? In this case, the <a> element ("The Ceremony") has the default black background. Couldn't find ... (continued)

    Last Reply by Sherry Bradford 12 months ago




Following

Followers

My Posts

My Comments

You commented on Christian Cruz's post 12 months

I ended up having to create a totally separate css file for the top-bar. My pages are buried deep behind several layers of corporate css so we always have issues with downstream impacts on foundation css. In some cases, I had to go the hellish route of putting the style right into the page. I definitely do not recommend that - but in some cases there simply was no other solution. Fortunately our total number of pages with the top-bar nav is low so it isn't as horrible as it would be in a major web environment.

You commented on Sherry Bradford's post about 1 year

I found a "partial" solution. I had two versions of jquery in my code. I don't know enough about jquery to be able to troubleshoot very well, but I did work in the Chrome browser developer areas and found that one of those jquery files was behaving badly with the overall site theme (not controlled by me) and throwing an error. I removed the jquery causing the issue and that allowed the menu links to all work. It had some other minor impacts when I removed it, but all my primary foundation code worked OK (things like the accordion, sliders, etc.)
Insofar as the image, I had a "hero" style background image with an overlay of text that we change often. I tried different things with updating that area and ultimately went with just a straight banner image rather than hero and made the text part of the banner. That isn't a good solution for us but it did resolve the issue. My expectation is that, if I knew enough about jquery and javascript and CSS, I could have found a solution. I'm fair at CSS and javascript, but know nothing about jquery.
This menu is a temporary need for us so after spending two days getting it to work and deploying across multiple pages, I'm going to have to be happy with it working "as is". I suspect my question will not get other replies as it is about Foundation 5 and top-nav - and so many people have moved on to Foundation 6 and more refined nav options. But I'm grateful for the resources here and ultimately some of those helped me to find a way to work around this at least!
 

You commented on Sherry Bradford's post about 1 year

Rafi - are these two statements doing the same thing?
$(document).ready(foundation)();
AND
$(document.foundation();
 
 

You commented on Sherry Bradford's post over 1 year

LOL - no, we are a huge, modern airline and it is our corporate intranet for employees. There are hopes it will move off IE8 in the next year, but in the meantime this one particular "corner" of the intranet was redesigned to take advantage of whatever we could squeeze out of IE8. To add to the overall dilemma, we are built on frames as well. Foundation was a godsend in the effort to redesign this section and we get lots of compliments on usability.

Thank you for the post and I'll read up on the no.conflict mode info you provided and see if we can get past this one issue. I did learn the other day that IBM frames and IE8 have trouble with allowing links to open inside the page as you descend further into the navigation structure. The individual explaining this didn't have much detail to share, so I'm going to test out the no.conflict first. If that doesn't work, I'll investigate the nav level further.

I'm going to be so well trained on how to overcome IE8 issues that I fear I will never really get to enjoy working in a truly modern browser! Sigh.....

You commented on Sherry Bradford's post almost 2 years

@Clifton Canady Well, would that the world were perfect, but alas 'tis not. I work for a major airline and our corporate intranet is on IE8 - and likely will be for at LEAST another 6 months. And we are not alone in the corporate world, unfortunately. Our intranet itself could easily "flip the switch" and be on IE11 - but we host numerous applications whose interfaces will not function within IE8 - and thus we have to wait for money/time to be spent for them to change before we can do so. I'm just DELIGHTED that my little corner of the intranet at least gets to work with HTML5/CSS3 to the extent possible.

You commented on Sherry Bradford's post about 2 years

BITTEN BY IE8 AGAIN!!!!

This makes me crazy. The environment in which I must develop is set up for IE11 ONLY (don't EVEN get me started on how insane this is). But our actual environment is IE8. So adding position:absolute works great in IE11 - but will not work at all with IE8 (i have a gazillion shivs already taking care of just about everything possible and they aren't helping with this).

So IE8 is completely ignoring the position:absolute, doesn't line up to the left and so doesn't apply any of the left/top alignment.

AARGHHHHH......

You commented on Sherry Bradford's post about 2 years

You ROCK! Thank you!

You commented on James Cocker's post about 2 years

Jordi - I have not tried with 5.5. I am using 5.2 and I found that it was very important WHERE I put the shivs and the items at the close of the page AND it was also very important that I use IF lte IE 8 and not just IF lt IE9. IE 9 seems to work OK with most of the things I needed to do - and for whatever reason, my shiv statements were being ignored until I switched to lte IE 8. I also had to put the respond.min.js up right under the last css in the head for it to work correctly. I hope that helps and perhaps is something you can try to see if it helps with 5.5. What are you trying to accomplish with the css? Just the grid or something more spectacular? So far I have been able to get pretty much everything to work that I have tried - but again my site is not super complicated. Some elements I use in addition to the grid functionality are cards, slider, and getting ready to add the accordion feature. Responsive works to the level that I am able to correctly set up the grid - but that is more user error/lack of skills than the tool so far.

Good luck! If you need to see how I laid out my header and shivs, and what I put at the end before the close, I'll be happy to post those.

You commented on Sherry Bradford's post about 2 years

Thank you! Needless to say, will be sooooo glad when we move off IE8.....

You commented on Sherry Bradford's post about 2 years

Thank you!!!! Appreciate the very quick response. You ROCK!

Posts Followed



Following

Followers