hide pop-out in google docs viewer using javascript-jquery

问题

I am using google docs viewer to display word and PDF files in dialog in my application. But my client need that document should not get download. So want to hide 'Pop-out' option. Please help me for it. Below is my code snippet :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/blitzer/jquery-ui.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
    $(function () {
        $("#btnShow").click(function () {
            $("#dialog").dialog({
                modal: true,
                title: '',
                width: 750,
                height: 450,
                buttons: {
                    Close: function () {
                        $(this).dialog('close');
                    }                   
                },
                open: function () {
                    var object = "<iframe id='resViewer' src='https://docs.google.com/viewer?url=my_file.pdf&embedded=true' style='width: 700px; height: 700px;' frameborder='0'></iframe>";                    

                    $("#dialog").html(object);
                }
            });
        });
    });
</script>
<input id="btnShow" type="button" value="Show PDF" />
<div id="dialog" style="display: none">
</div>

Please help me.

If anyone knows any other way to display word and PDF file both give me way or suggest for this.

Thanks.

回答1:

The following CSS will remove the pop out button.

div[aria-label="Pop-out"] {
    display: none;
}
div["aria-label=toolbar"] {
    width: 52px;
}

But to get the CSS to apply to the iframe your going to have to do some trickery. See jQuery, select element inside iframe, which is inside an iframe and How to apply CSS to iframe?

来源：https://stackoverflow.com/questions/36147063/hide-pop-out-in-google-docs-viewer-using-javascript-jquery