I am using React Bootstrap Dropdown that will render text depending on what DropDown selection you choose. However, it only works on browsers that isn't Firefox.
<MenuItem key={item.key} onSelect={this.handleFilterSelect.bind(this)} eventKey={item.key} className="filter-option text-right">
{item.label}
</MenuItem>
I've tried switching onSelect with onClick, but I still get the same error. In the Firefox consol, the error says,
"ReferenceError: event is not defined react-bundle-1e7c66351cc2cc9138d2f506e79409f1.js:27:31664"
Any have an idea what's going on?
Related
Here is an example page:
https://www.lazada.vn/products/dam-xoe-so-mi-vien-den-han-quoc-dx30-trang-i145861801-s151858737.html
When I right-click the main product image on this page and choose "Inspect Element from the context menu, the DevTools open, but select the <body> tag instead of the one I clicked.
Chrome's DevTools do select the <img> tag, as expected.
Is this a bug in the Firefox DevTools?
When you right-click the image, you actually inspect the overlaying semi-transparent blue <div>, not the <img> tag. This <div> is only temporarily added when hovering the image.
The reason why you don't land at that <div> in the Firefox DevTools is that it's removed again as soon as you hover the context menu, while in the Chrome DevTools it's still there when moving the cursor over the context menu.
This is because mouse events are obviously blocked in Chrome while the context menu is shown, in Firefox not.
So, I see two solutions for your problem:
Use the inspection tool from within the Firefox DevTools:
This shows a highlighter, which blocks mouse events, so that you can inspect the image.
Request to change this behavior so that mouse events are not triggered while the context menu is open.
the tooltip are not working in mobile devices.
mdTooltip="message" [mdTooltipPosition]="tooltipPosition"
when I hover the the div that contain the code it's working on desktop
I know that on mobile I have to click but the click is not working.
My solution in Angular:
<button #tooltip="matTooltip" (click)="tooltip.toggle()" matTooltip="text" matTooltipPosition="above" aria-label="Button that shows a tooltip"> Tooltip </button>
use (click)="tooltip.toggle()" with #tooltip="matTooltip"
I'm using a specific template which seems to cause a deffect with scrolling.
Whenever I recieve data from ajax and insert enough HTML so that the page should get a vertical scrollbar, it doesn't.
When I open up chrome devtools, or when I hover an element that has a popover, the scrollbar suddenly appears.
It only seems to effect google chrome.
I can't seem to find the cause and I'm wondering if there is something I can do to trigger an update, just like the devtools do.
When using jQuery, you could try to do
$(window).trigger('resize');
To trigger a resize, like what happens when you open your devtools.
I have an ajax modal popup that animates the popup panel in.
Everything works fine in Firefox et al, but there are a couple of issues in IE8.
1) The text looks grainy (as per when you use a filter with text).
2) Hover state on buttons does not work.
I'm trying to find a solution, but struggling to come up with an answer. Maybe one solution is to try and call animation from javascript rather than place it in the aspx page.
Any ideas?
I'm using http://colorpowered.com/colorbox/ and jquery Tokeninput without problems - untill I combine them and want to tokenize an input field in an colorbox.
I load my file in a iframe through colorbox and jquery Tokeninput loads up suggestions just fine untill I want to touch one of the items in the populated list.
All is good on my regular computer. The problem only exist when using iPad/iPhone (hav'nt tried other touch devices).
Any ideas as to where the problem belongs? I'm not sure whether it's colorbox or jquery Tokeninput to blame?
Just to check I loaded http://loopj.com/jquery-tokeninput/demo.html in a colorbox - same problem. The demo page works just fine on iPad when not in an colorbox.
/anders
denmark
I've been having similar problems with other contents in colourbox. I think the problem is that iPhone Safari doesn't support position:fixed;