billyk
February 18, 2015, 7:39pm
1
I have a jquery SlideOut Tab on my page and when its open and I draw my browser window smaller the CSS Menu is on top of my SlideOut Tab. Is there a way to fix this issue so that the Css Menu is behind?
Thanks
http://www.smartytest.com/Wren
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Richard
(Richard)
February 18, 2015, 8:38pm
2
Don’t get me wrong, but in my opinion this is exactly how it’s supposed to work. When I -as a visitor- navigate to/through the menu, the slide-out no longer is of any interest for me. It covering the menu while I want to use the menu to go somewhere else just is annoying … right? Or am I missing something?
Richard
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
billyk
February 18, 2015, 8:44pm
3
Yes you are missing something. On smaller devices, iPad, iPhone, the SlideOut is behind the Css Menu. So you can see the menus choices as well as the other links on the SlideOut are all jumbled together. A real mess and difficult on touch devices.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
billyk
February 18, 2015, 9:06pm
4
This worked:
z-index: 9999; /– Added z-index – /
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Richard
(Richard)
February 18, 2015, 10:57pm
5
Strange, tests here with viewport widths 320/480/640/768/1024 didn’t show any overlapping issue …
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
billyk
February 18, 2015, 10:59pm
6
Because I added some z-index to the SlideOut div.
Billy
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Richard
(Richard)
February 18, 2015, 11:46pm
7
Okay … so now at viewport width of 640-768px it covers the menu or submenu when it’s maximized. Still don’t see the upside here, so now you force visitors to first minimize the ‘buy me here’ slide in order to properly use the navigation?
You could consider a full width vertical slide that pushes down the page’s content when maximized (like a kind of an accordion menu) … it keeps everything still visible, out of each others’ way and not cluttered at all.
http://fwdemo.rvanheukelum.com/159128-css-menu-load/index.html
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
billyk
February 18, 2015, 11:58pm
8
Very Nice Solution. Let me ponder.
Thank you.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
billyk
February 19, 2015, 12:00am
9
Can you send me the Freeway file or the code that you used?
Billy
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Richard
(Richard)
February 19, 2015, 9:52am
10
That’s probably going to be tonight, I’m out for the rest of the day, sorry
Richard
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
billyk
February 19, 2015, 3:05pm
11
Ok Thanks.
Billy
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Richard
(Richard)
February 19, 2015, 10:48pm
12
This should do it. It’s just a raw setup and can adjust whatever you like …
Richard
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi Richard, I’ve just found this post and have been playing around with adding further accordion items inside the original accordion, see example page: http://www.stundesign.co.uk/bickhambarn/new/test-two.html .
I’ve been adding the extra accordion items directly into your original .js file and re numbering as foolows:
$(document).ready(function() {
$('.accordionButton').click(function() {
$('.accordionButton').removeClass('on');
$('.accordionContent').slideUp('normal');
if($(this).next().is(':hidden') == true) {
$(this).addClass('on');
$(this).next().slideDown('normal');
}
});
$('.accordionContent').hide();
$('.accordionButton1').click(function() {
$('.accordionButton1').removeClass('on');
$('.accordionContent1').slideUp('normal');
if($(this).next().is(':hidden') == true) {
$(this).addClass('on');
$(this).next().slideDown('normal');
}
});
$('.accordionContent1').hide();
$('.accordionButton2').click(function() {
$('.accordionButton2').removeClass('on');
$('.accordionContent2').slideUp('normal');
if($(this).next().is(':hidden') == true) {
$(this).addClass('on');
$(this).next().slideDown('normal');
}
});
$('.accordionContent2').hide();
});
Is this the best way to be doing this? Also can I add some code that will make the ‘sub’ accordions slide shut rather than snap shut as they do now?
Thanks
Dave
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤
On 19 Apr 2016, 12:11 pm, Dave Dunning wrote:
Hi Richard, I’ve just found this post and have been playing around with adding further accordion items inside the original accordion, see example page: http://www.stundesign.co.uk/bickhambarn/new/test-two.html .
I’ve been adding the extra accordion items directly into your original .js file and re numbering as foolows:
$(document).ready(function() {
$(‘.accordionButton’).click(function() {
$('.accordionButton').removeClass('on');
$('.accordionContent').slideUp('normal');
if($(this).next().is(':hidden') == true) {
$(this).addClass('on');
$(this).next().slideDown('normal');
}
});
$(‘.accordionContent’).hide();
$(‘.accordionButton1’).click(function() {
$('.accordionButton1').removeClass('on');
$('.accordionContent1').slideUp('normal');
if($(this).next().is(':hidden') == true) {
$(this).addClass('on');
$(this).next().slideDown('normal');
}
});
$(‘.accordionContent1’).hide();
$(‘.accordionButton2’).click(function() {
$('.accordionButton2').removeClass('on');
$('.accordionContent2').slideUp('normal');
if($(this).next().is(':hidden') == true) {
$(this).addClass('on');
$(this).next().slideDown('normal');
}
});
$(‘.accordionContent2’).hide();
});
Is this the best way to be doing this? Also can I add some code that will make the ‘sub’ accordions slide shut rather than snap shut as they do now?
Thanks
Dave
Hi Richard I’ve now completed my menu and all working a treat with five ‘sub’ accordions, script seems to work as it should. Also worked out the snapping shut issue, I’d not set the div’s to flexible height!
Thanks
Dave
freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options
Richard
(Richard)
April 20, 2016, 9:38am
15
The mobile menu also appears on desktop view, is that correct?
I’ve used the breakpoints to show/hide different menu sets, which works just fine here (narrow browser window to see the effect):
I also worked on a coupe of other menu’s like:
Richard
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤
Nope it appears at a narrower breakpoint, desktop has a more traditional menu. I’ve got it set to slide down over the page rather than push as the client preferred it that way but I’ll implement push on another site I’m working on.
All those example are great; I’ve already downloaded your example of the slidepushnavigation that you posted elsewhere and am absorbing the details!
Really like your work and thanks as always for your advice and help.
Thanks
Dave
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤
billyk
April 20, 2016, 12:49pm
17
I love that second menu Richard. The one where the page seems to stack below. Did you do that entirely with freeway with some mark up?
Or is there some java running it?
Billy
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤
Simple question. How do I get my css menu to be on the front of my slide show? I select and the menu item for bring to the front is grayed out. On pages where I only have images, no problem.
Link below.
http://www.jrobinsondesign.com/slocomb/
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤
The styling in two.css is overruling the styling in index.css
in two
#navigation3.f-ms {
width: 100%;
z-index: 0;
In index
#navigation3 { height:auto; overflow:visible; position:relative; z-index:9999 }
Try adding
#navigation3.f-ms { z-index: 999 !important; }
In a style block in the before slot of Page>Html Markup;.
David
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤
Thanks David
I apologize for tagging onto this thread. had not realized I had done it.
John
freewaytalk mailing list
email@hidden
Update your subscriptions at:
The purpose of this topic is to provide information about the migration from FreewayTalk and Groups io to Discourse and the differences in Discourse, as well as a place to discuss the good or bad of the migration. For those previously subscribing...
Reading time: 2 mins 🕑
Likes: 1 ❤