Pass anchor name to ipyhon HTML display - jupyter-notebook

I have an HTML file that embeds element anchors so any browser can jump straight onto an element (e.g. output_full.html#pp_var_2786448025406367408).
I'd like to have Jupyter Lab render that HTML anchored element in a cell, but I couldn't manage to pass the anchor name (e.g. #pp_var_2786448025406367408) to ipython HTML display.
Is this even possible?

Related

How to write iframe.srcdoc content

The HTML code is generated from 3 textarea fields (HTML,CSS and Script) and put together as a string. Then it's written into iframe.srcdoc. It looks like -
<button>'Get value' </button><button>'Write DIV'</button><button>'Clear DIV'</button><DIV>'dddd'</DIV>
Script is :
let u;
function get_div(){let i=prompt("What value?");retrn i;};
function show_div(now){document.querySelectorAll("DIV")[0].innerHTML=now;};
function clear_div(){document.querySelectorAll("DIV")[0].innerHTML="";};
document.querySelectorAll("BUTTON")[0].setAttribute("onClick","u=get_div()");
document.querySelectorAll("BUTTON")[1].setAttribute("onClick","show_div(u);");
document.querySelectorAll("BUTTON")[2].setAttribute("onClick","clear_div()");
The first function works fine,it takes a value from a prompt window.
The third one also -it clears DIV.
Problem is with the second - it doe's nothing, when I put an alert() into setAttribute - setAttribute("onClick","alert();show_div(u);"); it shows alert but doesn't change the DIV element.
I use eval() function on iframe (content from window.top.textarea.value).
Any suggestions?
I tried to change DIV element by using it's inner HTML property. It is possible to remove its content but not to write it.
It is possible to change ie. button.innerText value but not the innerHTML of the DIV.

why I can't see filename of header tag when we inspect elements

when we inspect elements in css header tag why we can't see origin of file, if I I click on tag I can see source of file i.e. tut16.html?
If you inspect the elements with your browser F12, you will get each element with its filename (marked in red).
Here is an example of where to look to get the filename when you inspect css:
This screenshot is taken with the Firefox browser. If you hover your mouse over the link in your console, you will also get the path.

Hide a given combining character from HTML

I have HTML that contains text with accent marks (U+0301 - a combining character) to denote stress. I'd like to be able to show and hide the accents with a checkbox. Some of the HTML is dynamically generated.
Is there a way to do this with CSS only? (no JavaScript and no enclosing all occurrences of U+0301 in tags)
One idea I tried was to use a custom font that renders U+0301 as an empty glyph - it does hide U+0301 in isolation, but fails to hide it when it's combined with another character.

How do I add a custom CSS image to the target background behind a given layer of text in Squarespace?

We are working on customising a website for our client in Squarespace (so that they can manage it on their own).
I've added a CSS style to the background of a layer of text, but it won't show up. I have imported the image to use into Squarespace and I have the URL.
I have also inspected the page element and found the id that I'm wanting to target to.
This is my code:
#yui_3_17_2_5_1465050472193_17704 {
background-image: url("http://static1.squarespace.com/static/55bed56ee4b04fdc6e0dd0d8/t/5752e43c22482e7d77f53e3b/1465050172750/Share+the+Love+Kids+Club.png")
}
Why does this not add the image I expect?
In Squarespace, currently, any ID starting with "yui" can/will change on page refresh. That is because such IDs are dynamically generated. Therefore, you should not rely on them for use in CSS or Javascript.
However, it is currently accepted that block IDs (ID's starting with "block-" do not change as long as the block is not removed or moved in a way that causes it to be removed (such as dragging a text block directly above/below another text block).
Therefore, you should instead locate the block ID of the block to which you want the CSS rule applied. If you need to target with even greater specificity, start with the block ID then add specificity from there. For example:
#block-yui_3_17_2_4_1443109442267_11866 {
background-image: url("http://static1.squarespace.com/static/55bed56ee4b04fdc6e0dd0d8/t/5752e43c22482e7d77f53e3b/1465050172750/Share+the+Love+Kids+Club.png")
}
If this still doesn't give you enough to get the problem solved, consider adding a link to the page in question, and stating which block/area on the page you want to target.
Additional Information/References:
https://answers.squarespace.com/questions/59297/how-do-i-discover-a-block-id.html
https://answers.squarespace.com/questions/10450/which-ids-should-i-target-for-my-css.html

QT/WebKit GUI pass selected HTML element data to Qt app

I'm going to collecect form inputs on web pages to fill them next time automatically based on input field name.
How to pass selected/howered HTML element data in QtWebkit to qt application?
Like Firebug does.
Qt version: 4.6 / 4.7
Thanks.
Add some JavaScript to assign a unique ID or class to the element below the mouse pointer and then use the standard selectors with the QWebFrame to locate it.
A more simple solution might be the selector ":hover" but that will give you a whole bunch of elements which you need to filter because the mouse always hovers over HTML and BODY and all the other elements which are stacked upon each other below your mouse. So if the mouse is over a span in a paragraph, you will get at least HTML, BODY, P, SPAN.

Resources