The image that I want to check is in a bootstrap dropdown menu, and I would like to check its size without having to click on the dropdown menu, is it possible or is just a fantasy ?
Thank you !
/* EDIT */
Here is a little demo of what I have, and I would like to be able to get the size of the image without having to click on the dropdown menu
the link:
https://codepen.io/anon/pen/zEVZmr
Related
I am using mat-menu from Material-UI to have a menu. I want the menu to take all the width of the button which make it appear.
When I don't custom the width I got this:
However, when I modify in the inspector to add the propriety width: 100% to the class cdk-overlay-pane. I got this :
But when I click elsewhere in the page and click again in the mat-menu. It shows the mat-menu at top left corner of the page.
Also, when I modify the class cdk-overlay-pane directly in the code. The menu is showing directly at top left corner of the page.
My question is: How to modify the mat-menu width to show with the result of the second picture and have a persistent result knowing that the structure is like that when we add a mat-menu in the HTML
I don't know if this is possible, or if it is, then I'm very dumb.
So I'm using bootstrap 4 to make my wordpress theme. I would like to make the menu to never expand so it always showing the hamburger icon. Now, when the user click it, I'd like it to filled the entire screen like in this website www.tomango.co.uk.
I tried setting the width to 100%, nothing happens. Changing it to a set px also change the toggle button icon.
If you know how to do this, please help me.
This is what you need, please follow this...Just click on slide down, same as your requirement
https://www.w3schools.com/howto/howto_js_fullscreen_overlay.asp
So, I want to hover a search box under a sub header in ionic after pressing the search icon button as shown in the image below. The most important thing I want to achieve is, if I scroll the list downwards, the search box must hover below.
Therefore how can I do this ?. I'm using ionic version one.
Introduction to clearify the task
I have a Navbar on the left side of my page. It has two levels for Items. When it's displayed in a small device, only the icons of the first level are shown. If you hover over it a dropdown of sub-items wil be shown on the right side of the bar. So far so good.
When the user uses a normal device the first-level-items should be displayed as dropdown-headers and the sub-items should expand under their parent-items on click. So I planned to set the sub-items-container under the main-items with height: 0px; and exband it with javascript-onclick and a css transition.
But as you can see the sub-items are hovering over the main item.
Question
How can i ensure that the subitemlist is between the main-items and not over it?
Additionally the solution shouldn't destroy the responsivness.
Note: I really want to make my own navbar, so using Bootstrap is not an option. Also i'm sorry if the code is not the best, it's the first try.
Code
I have put the whole thing in a jsfiddle
you cant put it in sidebaritem you have to put it below it
I created a css dropdown menu so my site will work with iphones. The dropdown is working correctly except for when you hover over a dropdown the sub items in the menu expand but when you hover over them the image on the main dropdown item looses it's color. I have it setup so that a different image is displayed when the mouse is hovering over it. Here is a link to pretty much the same code I have on my website. I just want the image to stay the same whether I am hovering over the main menu item or the subitems. Any help would be much appreciated.
http://jsfiddle.net/h5xZT/5/
To update your code it's simple. That should set you on your way. There is no need to use the "button" within a li item.
http://jsfiddle.net/h5xZT/19/