相关疑难解决方法(0)

Twitter Bootstrap CSS影响谷歌地图

我正在使用Twitter Bootstrap,并拥有Google地图.

地图上的图像(例如标记)在Bootstrap中被CSS扭曲.

在Bootstrap CSS中有:

img {
    border: 0 none;
    height: auto;
    max-width: 100%;
}

Run Code Online (Sandbox Code Playgroud)

当我max-width使用Firebug 禁用该属性时,标记图像显示为正常.如何防止Bootstrap CSS影响Google地图图像？

css google-maps twitter-bootstrap

rak*_*los

2013 06-05

147
推荐指数

4
解决办法

5万
查看次数

AGM地图打印显示打印输出的差距

从chrome打印我的Angular AGM Map我在地图中得到了这个大的灰色间隙:

正如你所看到的,不仅是那里的灰色条(如果我关闭"背景图形"它会变成白色),但它也会将地图图像移到它下面

以下是重现此问题所需的简单代码:

app.component.ts:

import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    template: `
        <button (click)="clickPrint()">print</button>
        <agm-map id="Gmap" [latitude]="34.051759" [longitude]="-118.244576" [zoom]="17"></agm-map>
        `,
    styles: [`
        agm-map {
            height: 800px; //height: 100%;
        }
        button {
            position: absolute;
            z-index: 10;
        }
    `]
})
export class AppComponent {
    clickPrint() {
        print()
    }
}

Run Code Online (Sandbox Code Playgroud)

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { AgmCoreModule } from '@agm/core'

@NgModule({ …

Run Code Online (Sandbox Code Playgroud)

css printing google-maps-api-3 angular-google-maps angular

Jar*_*red

2018 10-04

10
推荐指数

1
解决办法

410
查看次数

FancyBox将DIV的内容显示为iFrame类型

这工作得很好：

<script type="text/javascript">
   $(document).ready(function() { 
       $.fancybox({'href' : 'http://www.cnn.com','frameWidth':500,'frameHeight':500,'hideOnContentClick': false,'type':'iframe'});
   });
</script>

Run Code Online (Sandbox Code Playgroud)

也就是说，FancyBox将打开并显示CNN主页。但是，如果我将href属性更改为“ #pg”

并以这种方式对页面进行编码：

 <body>

    <div id="pg"></div>

    <script type="text/javascript">
     document.getElementById("pg").innerHTML = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"><html xmlns=\"http://www.w3.org/1999/xhtml\"><head><title></title></head><body>test me now</body></html>";
    </script>
</body>

Run Code Online (Sandbox Code Playgroud)

FancyBox打开，但未显示任何文本。（文本“立即发短信给我”显示在#pg div元素中。请注意，它已在页面末尾分配给DIV的innerHTML。）

基本上，我想知道是否有一种方法可以动态地初始化DIV的innerHTML属性并将其显示为FancyBox类型的iFrame？（iFrame的内容将带有一个用于打印iFrame文档的按钮。）

TIA

更新：07/28/12

正如@arttronics所建议的，我整理了一个jsFiddle

总而言之，最终的目的是能够单击FancyBox内包含的按钮，该按钮可打印FancyBox的全部内容而无需打开另一个窗口。（我想将FancyBox用作由Javascript解析的内容的报表查看器。）

我认为我需要使用FancyBox的iframe播放器显示内容，但是我可能错了。

jsFiddle显示：

FancyBox能够使用嵌入式播放器显示可验证为HTML页面的文本。可以通过href或引用文本content。

但是，当播放器为iframe且内容来自时href，则FancyBox容器为空。如果内容来自该content属性，则FancyBox将显示404错误。

只需注释和取消注释jsFiddle代码即可了解我的意思。

任何有关如何实现目标的想法都将受到赞赏，并将获得投票！

TIA。

更新：2012年7月31日

这个新的jsFiddle示例：iframe报表查看器有效，但在FancyBox中无效

如您所见，我尝试了几种iframe在FancyBox中显示的方法。当FancyBox确实显示的内容时iframe，打印功能将中断。

我认为解决此问题的一种方法是将myContent变量的内容在加载后写入FancyBox，但是我（A）找不到要写入的DOM节点，而（B）我可以。 t时让FancyBox显示iframe使用其iframe播放器的iframe src="about:blank"。

有什么建议么？还是看到一种解决jsFiddle示例的方法？

javascript iframe jquery fancybox

Kar*_*arl

2012 07-31

4
推荐指数

1
解决办法

8911
查看次数

Fancybox - 添加打印功能

是的,我知道这里存在关于如何向fancybox添加打印按钮的问题.我在fancybox上添加了一个按钮(http://oi50.tinypic.com/2wfvn7r.jpg),但我不知道如何添加一个将要实现的功能:http://www.thatagency.com/design -Studio-博客/ 2010/04 /添加打印能力到的fancybox - jQuery的插件/

任何人都可以帮助和写这个按钮的功能？

我将非常感激

我的代码:http://www.filehosting.org/file/details/360044/fancybox-print.zip

demo/MY.htm

printing jquery button fancybox

Jar*_*ski

lucky-day

2
推荐指数

1
解决办法

1万
查看次数