Welcome to TalkGraphics.com
Page 2 of 5 FirstFirst 1234 ... LastLast
Results 11 to 20 of 49
  1. #11
    Join Date
    Apr 2015
    Location
    Germany
    Posts
    927

    Default Re: Navigation bar (hamburger) in mobile version

    You could try the following:
    1. With the text tool click the menu text and edit until it is the correct width.
    2. Then right click and Edit Navigation Bar.
    3. Remove the tick at Adjust button width to labels and hit OK.
    4. Completely remove the text. (You can't remove the text line itself but only the content.)
    5. In the page and layer gallery expand the Navbar Group and the Group inside of it.
    6. Click the S to the right of the Group that is located beneath the text line. (Almost everything will be hidden in your design now.)
    7. Right click on the remaining objects and select Open Group
    8. Add your burger graphics here and hit the save button. (Hit CTRL + A and do a zoom to selection to help getting an idea of where the group content is to be found.)
    9. Repeat steps 5 to 8 on the mouse over layer.

  2. #12
    Join Date
    Apr 2015
    Location
    Germany
    Posts
    927

    Default Re: Navigation bar (hamburger) in mobile version

    By the way. Maybe its only a problem with my internet connection but I don't think so.
    A file on your server seems to be corrupt. It is roe.js in the folder index_htm_files.
    Maybe you should re-publish the site and maybe you need to remove the Fast Publish option for this problem to be fixed.
    You could also do an export to HTML to your local drive and upload that single file manually with an FTP tool. The file is static so that should not cause problems.

  3. #13
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,917

    Default Re: Navigation bar (hamburger) in mobile version

    If you create a group of a rectangle with matching background colour and the hamburger image of whatever colour you require, sit it above the text, as in Siran's instructions above, you don't need to worry about the text as the navbar is converted to a bitmap on export.

    Your site looks like it has issues to me too.
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	hamburger-menu-2.png 
Views:	72 
Size:	20.2 KB 
ID:	119323  
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  4. #14
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,503

    Default Re: Navigation bar (hamburger) in mobile version

    This works.

    Create a simple button rectangle. Add some text and the hamburger icon. Group all.

    Make the text and the rectangle the same color as the page background. IOW the text and rectangle are invisible. (In my example I have made them gray so you can see the objects).

    No need for mouse over because this is for mobile variants.

    Select the grouped objects and create a Navigation Bar.
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	menu.png 
Views:	74 
Size:	4.1 KB 
ID:	119324  

  5. #15
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,503

    Default Re: Navigation bar (hamburger) in mobile version

    Here's an example http://gwpriester.xara.hosting/hamburger/

    The button is about half size to allow for expansion to the right for sub menus.
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	screen.png 
Views:	84 
Size:	28.8 KB 
ID:	119325  

  6. #16
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,503

    Default Re: Navigation bar (hamburger) in mobile version

    Siran said you can also set the fill for the rectangle and the text to none. This is good if you have a background that is not a solid color.

    http://gwpriester.xara.hosting/hamburger-2/. It works! And it works on my iPhone!!!

  7. #17

    Default Re: Navigation bar (hamburger) in mobile version

    Hi Siran and thanks for your instruction. I will give it a try. I'm not sure I understand it completely but will follow the steps and see where I get.

  8. #18

    Default Re: Navigation bar (hamburger) in mobile version

    Hi Siran. I get an error message each time I open up this website in Xara. I've reported it and many months ago they told me there would be a fix and none there hasn't been thus far. Appreciate you helping, maybe this is the culprit. I actually use both ways to publish websites. Anyway to removed it from Xara without a problem and maybe that will fix it locally?

  9. #19

    Default Re: Navigation bar (hamburger) in mobile version

    Beautiful!!

  10. #20

    Default Re: Navigation bar (hamburger) in mobile version

    Removed it, Siran. Do you know what this file is for? I don't think I have Fast Publish...maybe I did. I'm not sure what it is.
    Sorry I'm not responding to you faster as I'm not getting notifications after the first few posts from gw..

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •