I am trying to create a input box somewhere on the screen in chrome, not attached to extension button like a normal popup,
it also needs to be running all the time so the user doesnt need to click the extension button to open it, for example so they do not have to come out of fullscreen.
What i have so far since im not great at html or java just a simple form
What i have: http://i.imgur.com/xCY1a41.png
What i want: http://i.imgur.com/cJH8bD4.png
I would also like to control the position of the form but from what i have above doesnt seem as if i will be able,
Sorry if its a bit vague but anything helps!
What you want to do can't be done in Chrome. This is by design. If web content could display itself outside the boundaries of the browser tab's content area, then users might be confused who was presenting it. Confusion is just the beginning of that problem: if web/extension content could masquerade as a system or browser-level alert, then that content could trick the user into doing something dangerous.
If you need a presence outside of a browser tab, your options are a native app or Chrome App.
If you want the input box to be displayed on the page you could use content script - then it would appear as you presented.
Related
I am using Google Analytics on a Sharepoint site. On the main page, we have an image in an image carousel that once clicked will bring you to a different page on the site. I have tried everything to track clicks on this image in GTM - click url, click ID, css selector, etc. I can not figure out why my trigger never fires. I have attached the
image, what pops up when I click inspect, and variables that show up with the click in GTM preview... (This is the second half of the variables in preview).Three images total.
Good job on including all the relevant debugging info.
Judging from your inspect, you're looking at the image.
However, judging from your click event inspection, the click lands on an a.
I don't see the a in your DOM on the screenshot, but it may be either dynamically added, or just outside of the screenshot.
No matter. Let's start to carefully debug it. Make a trigger that would be triggered on anything that matches a. That's just a debugging trigger. Make sure it triggers on your image clicks.
Now, let's just make a simple CJS variable that would console.log({{Click Element}}). No need to use it anywhere, just make it. Go to the debug view again, try clicking the banner again and look in the console for something that would look like this:
See that pretty element? Now the wonderful dev console allows you to copy JS path to this element and do whatever you want with it. Mainly, comfortably and quickly test CSS selectors against this element. I suggest changing the selector JS console generated. It should work (unless the page is too dynamic), but it would be fragile. Having the element, however, you'll be able to make your own selectors.
I'm curious what's the proper way to push the screen read to read <span>read me on load</span> first (it's in the middle of the html page) when the page is loaded?
Even
role="rude"
doesn't help for some reason.
Thank you.
What you are using is not part of ARIA live regions. You want either role=alert or aria-live=assertive (though in an early draft "assertive" was originally "rude").
Now, that being said, live regions are intended for use on an already-loaded page. If you are making a dialog, then your HTML might look like this:
<div role="alert" aria-live="assertive">
Anything in here will be announced as soon as it changes.
</div>
If you want the dialog to be announced at page load, then consider hiding its contents and then using script to display its contents once the page has finished loading.
If you need to make it announce as soon as the page loads and it is not a dialog, consider moving focus to the element at page load using script. By placing focus, the browser will announce whatever it is.
For this to work, however, you cannot just place focus on a <span> as it is not interactive content. You can make it interactive by adding a tabindex attribute. If you do that, then you will need to add a role describing what the element does (you can use role=region if you are stuck) so that the screen reader can announce what it is instead making the user think she has landed on a control or otherwise expect to be able to take an action.
If you are moving focus to the element for users without screen readers, or if the very first thing the page displays at page load is an alert of some sort, then this should be fine.
However, since you have provided no context and no examples, and given all the ways this can be done that are far worse than doing nothing, please ask yourself this:
Is the thing you want to announce…
…an alert or dialog?
…a control that already can receive keyboard focus?
…going to be given focus for all users, not just those with screen readers?
If you end up saying no twice then you should not do this.
If you can provide an example URL that shows what you want to do, then I am happy to help you get it working. Otherwise I fear you may be coding something that ends up creating a trap or barrier for screen reader users.
Currently trying to make a section of a site more readable to screen readers (Jaws, MacVoice over, ect). One of the buttons on the page generates a popup that in turn the user will need to be notified of, the problem is this popup is generated at the bottom of the DOM meaning that the user would have to navigate to the bottom of the dom (tabbing through) in order to even know the page is there. Does anyone know a possible way around this?
You can try removing it from the generated place with javascript and append it to a more convienant/logic place for the user. The code should be something like:
$('#amoreconvenientplaceforthebuttonID').append($('#mybuttonID'));
$('#mybuttonID').remove();
I am working on getting only a part of the navigated webpage.
for example, "the face book . com" homepage.
I only want the division of groups on the left to appear in my web Browser control.
is that possible?
I am having ideas on fetching but i don't know how to do it. any other way is fine.
also, please let me know where to put the code, because i am new on vb.net
web.Document.All("mConnect").InvokeMember("click")
this is for clicking something inside the html
web.Document.getElementId("<div>").InnerHtml("")
is this code correct? what is it for?
let's say we cut the google homepage 4 ways. and i only want Quadrant 2 to appear in my webBrowser control. is that possible? I think this is a clearer explanation..
I saw one post in this forum that technically solved my problem by manually forcing the webbrowser control to scroll to what place I want.
Web.Navigate("javascript:window.scroll(320,10,document.body.scrollHeight);")
320 is the width, 10 is the height. edit to where you want it to be.
adjust the size of your webBrowser then you can particularly choose the part that you want to see, disable scrollbars if you want.
This may be the dumbest question ever but our customer really wants this. I am asking this silly question just to be sure that it cannot be done.
We have a popup window which has opened by window.showModalDialog (img 1)
In this window there is a custom autocomplete control which displays an html table. The problem is autocomplete table is wider than the modal dialog. So user is unable to see the contents of this table. (img 2)
Then we made initial size of the modal dialog wider enough to see table contents but customer did not want the initial empty area and did not want the content to be wider also. (img 3)
The customer wants to see the thing as in img 4 which i could only made by paint.
Is it possible to display overflowed html content outside the browser. At least for the ones which has opened by window.showModalDialog.
Note: This is about a 10 years old project and it is totally based on window.open and window.showModailDialog. So using a custom jquery dialog or something similar is not an option.
Within your client's constraints, your task is not possible.
What you could do instead is popup another modal window that shows the contents of the dropdown. That way, you can get a differently sized viewport than what the first modal window offers. Also, if you open the new one as a child, you could even pass messages between the 2 windows.
Of course this will be a very rudimentary stone-age solution! You may also come across a lot of browser limitations/quirks.