0

On my website I have Javascript that replaces the standard menu if it's viewed on a phone. If I remove the Javascript, the desktop menu will be shown. The code for the script is shown below and the attached image show the javascript menu show from a phone view:

enter image description here

What I want is the Javascript itself to be executed because then the desktop menu wont be shown, but I want the "Please choose page" and the list / box itself to be hidden like it's never even been there.

Can this be done somehow? Users should only se a white space where instead of the box shown in the image.

jQuery.noConflict()(function($) {
  $("<select />").appendTo("nav");
  $("<option />", {
    "selected": "selected",
    "value": "",
    "text": "Please choose page"
  }).appendTo("nav select");
  $("nav a").each(function() {
    var el = $(this);
    var perfix = '';
    switch (el.parents().length) {
      case (11):
        perfix = '';
        break;
      case (13):
        perfix = '-- ';
        break;
      default:
        perfix = '';
        break;
    }
    $("<option />", {
      "value": el.attr("href"),
      "text": perfix + el.text()
    }).appendTo("nav select");
    $("nav select").change(function() {
      window.location = $(this).find("option:selected").val();
    });
  });
});

function bookmarksite(title, url) {
  if (window.sidebar)
    window.sidebar.addPanel(title, url, "");
  else if (window.opera && window.print) {
    var elem = document.createElement('a');
    elem.setAttribute('href', url);
    elem.setAttribute('title', title);
    elem.setAttribute('rel', 'sidebar');
    elem.click();
  } else if (document.all)
    window.external.AddFavorite(url, title);
}
disinfor
  • 10,865
  • 2
  • 33
  • 44
overhauler
  • 9
  • 1
  • 1
    css? https://stackoverflow.com/q/35393429/3462319 – depperm Jan 12 '23 at 12:24
  • It looks like you can't show the menu without JavaScript, it's dynamically created with JS, it's not included in the original markup. – Teemu Jan 12 '23 at 12:28
  • What i want is the Javascript itself to be executed because then the desktop menu wont be show but i want the "Please choose page" and the list / box itself to be hidden like it's never even been there. Can this be done somehow ? Users should only se a white space where insteed of the box shown in the image. – overhauler Jan 12 '23 at 15:21
  • 1
    Welcome!! This seems like an [X/Y problem](https://xyproblem.info/). Why don't you just use CSS to hide/display the menus depending on screen size? Both menus (the drop down and your normal desktop) are there, but shown/hidden based on screen size and CSS media queries. – disinfor Jan 12 '23 at 15:31

1 Answers1

1

you could use cordova https://cordova.apache.org/

this would allow you to understand if you are on a mobile device or instead in a computer web brownser with just a:

if(typeof cordova == 'undefined' || !cordova) { 
        //Web browser JS
    } else {
        //Mobile phone JS
    }

this way you can just do a addAttr.("hidden", true) to hide in the mobile part or split your code in a cleaner way.

Hope this is helpful

Grismak
  • 192
  • 16
  • What i want is the Javascript itself to be executed because then the desktop menu wont be show but i want the "Please choose page" and the list / box itself to be hidden like it's never even been there. Can this be done somehow ? Users should only se a white space where insteed of the box shown in the image. – overhauler Jan 12 '23 at 15:21
  • you can do that choosing when do you want the JS code to be execute, with events like onLoad() you make the JS execute when the html is loading, or onReady() when the html finished executing. – Grismak Jan 16 '23 at 06:36