QWebengine玩转HTML

QWebengine玩转HTML

简述

发现Qt一新大陆,以下Jequery控制,更多好玩的好看的效果大家修改,玩耍,嗨皮!

效果图

HTML滚动条样式修改

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

代码
QString readFiledata(const QString& filepath)
{
	QFile file;
	file.setFileName(filepath);
	file.open(QIODevice::ReadOnly);
	QString data = file.readAll();
	file.close();
	return data;
}

void WebView::initControl()
{
	qputenv("QTWEBENGINE_REMOTE_DEBUGGING", "9223");
	m_jQuery = readFiledata(":/WebenginePlay/Resources/jquery.min.js");
	m_jQuery.append("\nvar qt = { 'jQuery': jQuery.noConflict(true) };");

	connect(this, SIGNAL(titleChanged(QString)), SLOT(adjustTitle()));
	connect(this, SIGNAL(loadProgress(int)), SLOT(setProgress(int)));
	connect(this, SIGNAL(loadFinished(bool)), SLOT(finishLoading(bool)));
}

void WebView::loadUrl(QUrl url)
{
	this->load(url);
}

void WebView::adjustTitle()
{
	if (m_progress <= 0 || m_progress >= 100)
		parentWidget()->setWindowTitle(this->title());
	else
		parentWidget()->setWindowTitle(QString("%1 (%2%)").arg(this->title()).arg(m_progress));
}

void WebView::setProgress(int p)
{
	m_progress = p;
	adjustTitle();
}

void WebView::finishLoading(bool)
{
	m_progress = 100;
	adjustTitle();
	QString code = "qt.jQuery('<link>').attr({ rel: \"stylesheet\",type: \"text/css\",href: \"qrc:/WebenginePlay/Resources/rotate.css\"}).appendTo(\"head\"); undefined";
	m_jQuery.append("\n");
	m_jQuery.append(code);
	page()->runJavaScript(m_jQuery);
}

void WebView::highlightAllLinks()
{
	QString code = "qt.jQuery('a').each( function () { qt.jQuery(this).css('background-color', 'yellow') } ); undefined";
	this->page()->runJavaScript(code);
}

void WebView::rotateImages()
{
	QString code = "qt.jQuery('img').addClass(\"header\");";
	this->page()->runJavaScript(code);
}

void WebView::removeGifImages()
{
	QString code = "qt.jQuery('[src*=gif]').remove()";
	this->page()->runJavaScript(code);
}

void WebView::updateScrollerStyle()
{
	QString code = "qt.jQuery('body').each( function () { qt.jQuery(this).css('background', 'rgba(200,200,200,100)') } ); undefined";
	this->page()->runJavaScript(code);
}

工程文件

Qt交流大会 853086607 (1元群,用于后期升级群费用)
在这里插入图片描述

结尾

不定期上传新作品,解答群中作品相关问题。相关外,能解答则解答。欢迎大家一起探索Qt世界!相关工程,可以联系博主雨田哥:3246214072

  • 0
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

雨田哥

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值