Mixing
off-canvas menu designed by helix3 disappears in mobile mode of my site
I'm building a persian (rtl) website with an offcanvas menu using helix3. The site works fine in all modes (mobile/desktop) when testing with "responsive web design Tester" or other testing tools. But when surfing the site with tablet or ipad, the offcanvas menu appears for a second or 2 and then disappears surprisingly (It works fine over iPhone 7).
I am using helix3, joomla 3.8.10 and jquery v1.12.0.
my site: www.bapgroup.ir
Any help would be highly appreciated.
joomla responsive-design helix off-canvas-menu
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
asked Jan 1 at 11:52
azita darooeiazita darooei
127
add a comment |
I'm building a persian (rtl) website with an offcanvas menu using helix3. The site works fine in all modes (mobile/desktop) when testing with "responsive web design Tester" or other testing tools. But when surfing the site with tablet or ipad, the offcanvas menu appears for a second or 2 and then disappears surprisingly (It works fine over iPhone 7).
I am using helix3, joomla 3.8.10 and jquery v1.12.0.
my site: www.bapgroup.ir
Any help would be highly appreciated.
joomla responsive-design helix off-canvas-menu
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
asked Jan 1 at 11:52
azita darooeiazita darooei
127
Detect the browser is for mobile or desktop. here you can find how to do it : coderwall.com/p/i817wa/… then setdisplay: nonefor canvas if the browser is for mobile.
– bahman parsamanesh
Jan 1 at 12:05
The link in the mentioned url gives a 404 error. In addition, I wanna show canvas menu in mobile mode and disappear it it desktop mode.
– azita darooei
Jan 1 at 12:45
add a comment |
I'm building a persian (rtl) website with an offcanvas menu using helix3. The site works fine in all modes (mobile/desktop) when testing with "responsive web design Tester" or other testing tools. But when surfing the site with tablet or ipad, the offcanvas menu appears for a second or 2 and then disappears surprisingly (It works fine over iPhone 7).
I am using helix3, joomla 3.8.10 and jquery v1.12.0.
my site: www.bapgroup.ir
Any help would be highly appreciated.
joomla responsive-design helix off-canvas-menu
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
asked Jan 1 at 11:52
azita darooeiazita darooei
127
I'm building a persian (rtl) website with an offcanvas menu using helix3. The site works fine in all modes (mobile/desktop) when testing with "responsive web design Tester" or other testing tools. But when surfing the site with tablet or ipad, the offcanvas menu appears for a second or 2 and then disappears surprisingly (It works fine over iPhone 7).
I am using helix3, joomla 3.8.10 and jquery v1.12.0.
my site: www.bapgroup.ir
Any help would be highly appreciated.
joomla responsive-design helix off-canvas-menu
joomla responsive-design helix off-canvas-menu
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
asked Jan 1 at 11:52
azita darooeiazita darooei
127
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
asked Jan 1 at 11:52
azita darooeiazita darooei
127
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
edited Jan 1 at 11:58
bahman parsamanesh
1,543519
1,543519
asked Jan 1 at 11:52
azita darooeiazita darooei
127
asked Jan 1 at 11:52
azita darooeiazita darooei
127
asked Jan 1 at 11:52
azita darooeiazita darooei
127
127
Detect the browser is for mobile or desktop. here you can find how to do it : coderwall.com/p/i817wa/… then setdisplay: nonefor canvas if the browser is for mobile.
– bahman parsamanesh
Jan 1 at 12:05
The link in the mentioned url gives a 404 error. In addition, I wanna show canvas menu in mobile mode and disappear it it desktop mode.
– azita darooei
Jan 1 at 12:45
add a comment |
Detect the browser is for mobile or desktop. here you can find how to do it : coderwall.com/p/i817wa/… then setdisplay: nonefor canvas if the browser is for mobile.
– bahman parsamanesh
Jan 1 at 12:05
The link in the mentioned url gives a 404 error. In addition, I wanna show canvas menu in mobile mode and disappear it it desktop mode.
– azita darooei
Jan 1 at 12:45
Detect the browser is for mobile or desktop. here you can find how to do it : coderwall.com/p/i817wa/… then set
display: none for canvas if the browser is for mobile.– bahman parsamanesh
Jan 1 at 12:05
Detect the browser is for mobile or desktop. here you can find how to do it : coderwall.com/p/i817wa/… then set
display: none for canvas if the browser is for mobile.– bahman parsamanesh
Jan 1 at 12:05
The link in the mentioned url gives a 404 error. In addition, I wanna show canvas menu in mobile mode and disappear it it desktop mode.
– azita darooei
Jan 1 at 12:45
The link in the mentioned url gives a 404 error. In addition, I wanna show canvas menu in mobile mode and disappear it it desktop mode.
– azita darooei
Jan 1 at 12:45
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53995193%2foff-canvas-menu-designed-by-helix3-disappears-in-mobile-mode-of-my-site%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53995193%2foff-canvas-menu-designed-by-helix3-disappears-in-mobile-mode-of-my-site%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Detect the browser is for mobile or desktop. here you can find how to do it : coderwall.com/p/i817wa/… then set
display: nonefor canvas if the browser is for mobile.– bahman parsamanesh
Jan 1 at 12:05
The link in the mentioned url gives a 404 error. In addition, I wanna show canvas menu in mobile mode and disappear it it desktop mode.
– azita darooei
Jan 1 at 12:45