Chrome displays content type pdfs into a dom like this:
<html>
<body style="background-color: rgb(38,38,38); height: 100%; width: 100%; overflow: hidden; margin: 0">
<embed width="100%" height="100%" name="plugin" id="plugin"
src="http://che.org.il/wp-content/uploads/2016/12/pdf-sample.pdf" type="application/pdf" internalinstanceid="3">
</body></html>
What is the easiest way to access the interior UI of the embed? Separately, is Chrome CRI able to do this?
(Apparently native Ctrl-F works, so there had got to be a way.)
Related
I'm using Docusing php api to create and send documents to sign, but when I try to insert an image (I'm using HTML document) the document show's the signer only a white square with the text:
The linked image cannot be displayed. the file may have been moved, renamed, or deleted. Verify that the link points to the correct file and location.
Of course I check the image link several times, I changed the image to another server, try different formats, etc...
Any suggestions??
My HTML goes like:
return <<<HTML
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
</head>
<body>
<img style="display: block; margin-left: auto; margin-right: auto;" src="/documents/logo.png" alt="" width="250" height="100" />
<p style="font-family: Garamond; text-align: center; font-size: 14pt; line-height: 0.1;"><strong>Document title</strong></p>
and then the rest of the document.
The only way to add an image to an htlm source doc used for DocuSign is to include it, inline, within the html. In the same way, any CSS must also be inline.
Use a dataurl with an img tag. It works fine.
If you want an embedded image I would suggest that it's inline in the HTML, or you can use PDF or Word or some other format that doesn't require the other file to be loaded.
the DocuSign system cannot load that file and in any case would "flatten" your HTML into a PDF anyway (unless you use responsive signing).
Some data processing takes a few seconds once the server has received the client's request...
How can we display an advertisement while the client waits for the payload ?
Same question with and without AJAX
We may not use a library or framework on top of Sails, unless necessary
You can do a simple loading graphic, and just replace it with whatever image you want:
HTML
<div class="loader"></div>
CSS
.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url('images/page-loader.gif') 50% 50% no-repeat rgb(249,249,249);
}
A simple jQuery function:
$(window).load(function() {
$(".loader").fadeOut("slow");
})
Demo
Source: Display Loading Image While Page Loads
If you need to do it without jQuery, it is slightly more involved, but you can get more information in this thread:
$(document).ready equivalent without jQuery
In WPF(Windows Presentation Foundation) you can put an image into a button to create an image button, you can also add a text after that, not only one label but more, all on the same button.
My question is how can I do that in JSF with PrimeFaces or another component.
I have included a picture
to let you understand what I did try and what I wanted, any help is appreciated, Thank you.
For JSF
<p:commandButton value="Cancel" icon="ui-icon-myCancel" />
IN css
.ui-icon-myCancel{
background-image: url("#{resource['images/test.jpg']}") !important;
}
JSP
Css:
input#image-button{
background: #ccc url('icon.png') no-repeat top left;
padding-left: 16px;
height: 16px;
}
HTML
<input type="submit" id="image-button" value="Text"></input>
It will give you some hint
I am building an extension which give user notifications using the createHTMLNotification call, but I am having some trouble figuring out the relevant size restrictions to avoid getting ugly black horizontal and vertical scrollbars (On Ubuntu 12.04 Linux at least).
Does anybody have any pointers to documentation giving some hints about what maximum sizes I should be aiming for, hopefully cross-platform?
maximum size on Windows Version 20.0.1132.47 (stable 144678) is 300 by 160 pixels.
Experiments on my own laptop running Chrome on Linux Version 21.0.1145.0 dev give me a maximum size of 284 by 144 pixels before scrollbars appear. I have no idea whether this is system specific or not, but assuming Chrome supports native notifications for at least some platforms that have them, I guess putting too much effort into pixel perfect notifications may not guarantee nice results.
As for making sure the scrollbars do not appear inside the notification, there is another small challenge as well (which maybe is not be related to the notification API at all); setting the height and max-height (and similarily for the width) does not cut it on it's own.
In my case I needed to style a list of items in a notification, and what I ended up doing was using the following html code:
<html>
<head>
<style>
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: .73em;
}
div#note {
overflow: hidden;
height: 144px;
max-height: 144px;
width: 284px;
}
div.noteline {
position: relative;
overflow: hidden;
overflow-x: hidden;
overflow-y: hidden;
white-space: nowrap;
text-overflow: ellipsis;
line-height: 1.2em;
}
</style>
</head>
<body>
<div id=\"note\">#{params.html}</div>
</body>
</html>
My template references (#{params.html}) is basically populated with rows containing :
<div class="noteline">Some possibly large line that would overflow item 123</div>
I have a page in DW that has a black background. In Design View of the page the page shows as white instead of black. I am not sure why this is. I can add inline styles to the entire page as follows to get the page black:
<body>
<div style="background-color:#000" class="wrap_fullwidth">
<div style="background-color:#000" class="center">
<div style="background-color:#000" class="img-center">
<img src="image.jpg" alt="Image" />
</div>
<p style="background-color:#000"> </p>
</div>
</div>
</div>
</body>
Here is the CSS for the page and the way it normally is:
html, body{
font-size:16px;
font-family:"Lucida Grande", Helvetica, Arial, sans-serif;
line-height:23px;
color:#f3f3f3;
background:#000;
}
.wrap_fullwidth {width:100%; position:relative; float:left;
clear:both; padding-top:20px; }
.center{width:940px; position:relative; margin:0 auto;
clear:both; padding:0px 10px; display:block;}
p{ margin-bottom:20px; text-align:justify;}
.img-center{ text-align: center; }
The design view should show the page as it appears with css etc. I do not understand why the white is showing when the css clearly shows black as a background. The good thing is the page in the browser shows correctly but this makes things a pain if I work in Design View. (Which I do use)
Ideas or thoughts as to how to fix this?
Note: CS5 and CS5.5 did not have this behavior. Only CS6.
It turned out that my Reset for the CSS was causing DW to show a transparent background (thus white) instead of black.
The reset contained this property: background:transparent;
Once I removed that from the reset all worked fine.
Update: I had wondered if the way DW CS6 was reading the CSS if there was a bug or not, after filing a bug report I received this reply:
I was able to reproduce as per your steps and have logged a backlog item for the same. It will be fixed in future release.