Sophie

Sophie

distrib > Fedora > 18 > x86_64 > by-pkgid > ff187cb994c94c614ecc64c5a8528b1b > files > 7776

qt-doc-4.8.5-10.fc18.noarch.rpm

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en_US" lang="en_US">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- fancybrowser.qdoc -->
  <title>Qt 4.8: Fancy Browser Example</title>
  <link rel="stylesheet" type="text/css" href="style/style.css" />
  <script src="scripts/jquery.js" type="text/javascript"></script>
  <script src="scripts/functions.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="style/superfish.css" />
  <link rel="stylesheet" type="text/css" href="style/narrow.css" />
  <!--[if IE]>
<meta name="MSSmartTagsPreventParsing" content="true">
<meta http-equiv="imagetoolbar" content="no">
<![endif]-->
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="style/style_ie6.css">
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="style/style_ie7.css">
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="style/style_ie8.css">
<![endif]-->

<script src="scripts/superfish.js" type="text/javascript"></script>
<script src="scripts/narrow.js" type="text/javascript"></script>

</head>
<body class="" onload="CheckEmptyAndLoadList();">
 <div class="header" id="qtdocheader">
    <div class="content"> 
    <div id="nav-logo">
      <a href="index.html">Home</a></div>
    <a href="index.html" class="qtref"><span>Qt Reference Documentation</span></a>
    <div id="narrowsearch"></div>
    <div id="nav-topright">
      <ul>
        <li class="nav-topright-home"><a href="http://qt.digia.com/">Qt HOME</a></li>
        <li class="nav-topright-dev"><a href="http://qt-project.org/">DEV</a></li>
        <li class="nav-topright-doc nav-topright-doc-active"><a href="http://qt-project.org/doc/">
          DOC</a></li>
        <li class="nav-topright-blog"><a href="http://blog.qt.digia.com/">BLOG</a></li>
      </ul>
    </div>
    <div id="shortCut">
      <ul>
        <li class="shortCut-topleft-inactive"><span><a href="index.html">Qt 4.8</a></span></li>
        <li class="shortCut-topleft-active"><a href="http://qt-project.org/doc/">ALL VERSIONS        </a></li>
      </ul>
     </div>
 <ul class="sf-menu" id="narrowmenu"> 
             <li><a href="#">API Lookup</a> 
                 <ul> 
                     <li><a href="classes.html">Class index</a></li> 
           <li><a href="functions.html">Function index</a></li> 
           <li><a href="modules.html">Modules</a></li> 
           <li><a href="namespaces.html">Namespaces</a></li> 
           <li><a href="qtglobal.html">Global Declarations</a></li> 
           <li><a href="qdeclarativeelements.html">QML elements</a></li> 
             </ul> 
             </li> 
             <li><a href="#">Qt Topics</a> 
                 <ul> 
                        <li><a href="qt-basic-concepts.html">Programming with Qt</a></li>  
                        <li><a href="qtquick.html">Device UIs &amp; Qt Quick</a></li>  
                        <li><a href="qt-gui-concepts.html">UI Design with Qt</a></li>  
                        <li><a href="supported-platforms.html">Supported Platforms</a></li>  
                        <li><a href="technology-apis.html">Qt and Key Technologies</a></li>  
                        <li><a href="best-practices.html">How-To's and Best Practices</a></li>  
              </ul> 
                 </li> 
                 <li><a href="#">Examples</a> 
                     <ul> 
                       <li><a href="all-examples.html">Examples</a></li> 
                       <li><a href="tutorials.html">Tutorials</a></li> 
                       <li><a href="demos.html">Demos</a></li> 
                       <li><a href="qdeclarativeexamples.html">QML Examples</a></li> 
                </ul> 
                     </li> 
                 </ul> 
    </div>
  </div>
  <div class="wrapper">
    <div class="hd">
      <span></span>
    </div>
    <div class="bd group">
      <div class="sidebar">
        <div class="searchlabel">
          Search index:</div>
        <div class="search" id="sidebarsearch">
          <form id="qtdocsearch" action="" onsubmit="return false;">
            <fieldset>
              <input type="text" name="searchstring" id="pageType" value="" />
 <div id="resultdialog"> 
 <a href="#" id="resultclose">Close</a> 
 <p id="resultlinks" class="all"><a href="#" id="showallresults">All</a> | <a href="#" id="showapiresults">API</a> | <a href="#" id="showarticleresults">Articles</a> | <a href="#" id="showexampleresults">Examples</a></p> 
 <p id="searchcount" class="all"><span id="resultcount"></span><span id="apicount"></span><span id="articlecount"></span><span id="examplecount"></span>&nbsp;results:</p> 
 <ul id="resultlist" class="all"> 
 </ul> 
 </div> 
            </fieldset>
          </form>
        </div>
        <div class="box first bottombar" id="lookup">
          <h2 title="API Lookup"><span></span>
            API Lookup</h2>
          <div  id="list001" class="list">
          <ul id="ul001" >
              <li class="defaultLink"><a href="classes.html">Class index</a></li>
              <li class="defaultLink"><a href="functions.html">Function index</a></li>
              <li class="defaultLink"><a href="modules.html">Modules</a></li>
              <li class="defaultLink"><a href="namespaces.html">Namespaces</a></li>
              <li class="defaultLink"><a href="qtglobal.html">Global Declarations</a></li>
              <li class="defaultLink"><a href="qdeclarativeelements.html">QML elements</a></li>
            </ul> 
          </div>
        </div>
        <div class="box bottombar" id="topics">
          <h2 title="Qt Topics"><span></span>
            Qt Topics</h2>
          <div id="list002" class="list">
            <ul id="ul002" >
               <li class="defaultLink"><a href="qt-basic-concepts.html">Programming with Qt</a></li> 
               <li class="defaultLink"><a href="qtquick.html">Device UIs &amp; Qt Quick</a></li> 
               <li class="defaultLink"><a href="qt-gui-concepts.html">UI Design with Qt</a></li> 
               <li class="defaultLink"><a href="supported-platforms.html">Supported Platforms</a></li>  
               <li class="defaultLink"><a href="technology-apis.html">Qt and Key Technologies</a></li> 
               <li class="defaultLink"><a href="best-practices.html">How-To's and Best Practices</a></li> 
            </ul>  
          </div>
        </div>
        <div class="box" id="examples">
          <h2 title="Examples"><span></span>
            Examples</h2>
          <div id="list003" class="list">
        <ul id="ul003">
              <li class="defaultLink"><a href="all-examples.html">Examples</a></li>
              <li class="defaultLink"><a href="tutorials.html">Tutorials</a></li>
              <li class="defaultLink"><a href="demos.html">Demos</a></li>
              <li class="defaultLink"><a href="qdeclarativeexamples.html">QML Examples</a></li>
            </ul> 
          </div>
        </div>
      </div>
      <div class="wrap">
        <div class="toolbar">
          <div class="breadcrumb toolblock">
            <ul>
              <li class="first"><a href="index.html">Home</a></li>
              <!--  Breadcrumbs go here -->
<li><a href="all-examples.html">Examples</a></li>
<li>Fancy Browser Example</li>
            </ul>
          </div>
          <div class="toolbuttons toolblock">
            <ul>
              <li id="smallA" class="t_button">A</li>
              <li id="medA" class="t_button active">A</li>
              <li id="bigA" class="t_button">A</li>
              <li id="print" class="t_button"><a href="javascript:this.print();">
                <span>Print</span></a></li>
            </ul>
        </div>
        </div>
        <div class="content mainContent">
<div class="toc">
<h3><a name="toc">Contents</a></h3>
<ul>
<li class="level1"><a href="#mainwindow-class-definition">MainWindow Class Definition</a></li>
<li class="level1"><a href="#mainwindow-class-implementation">MainWindow Class Implementation</a></li>
</ul>
</div>
<h1 class="title">Fancy Browser Example</h1>
<span class="subtitle"></span>
<!-- $$$webkit/fancybrowser-description -->
<div class="descr"> <a name="details"></a>
<p>Files:</p>
<ul>
<li><a href="webkit-fancybrowser-jquery-min-js.html">webkit/fancybrowser/jquery.min.js</a></li>
<li><a href="webkit-fancybrowser-mainwindow-cpp.html">webkit/fancybrowser/mainwindow.cpp</a></li>
<li><a href="webkit-fancybrowser-mainwindow-h.html">webkit/fancybrowser/mainwindow.h</a></li>
<li><a href="webkit-fancybrowser-main-cpp.html">webkit/fancybrowser/main.cpp</a></li>
<li><a href="webkit-fancybrowser-fancybrowser-pro.html">webkit/fancybrowser/fancybrowser.pro</a></li>
<li><a href="webkit-fancybrowser-jquery-qrc.html">webkit/fancybrowser/jquery.qrc</a></li>
</ul>
<p>The Fancy Browser example shows how to use jQuery with <a href="qtwebkit.html">QtWebKit</a> to create a web browser with special effects and content manipulation.<p class="centerAlign"><img src="images/fancybrowser-example.png" alt="" /></p><p>The application makes use of QWebFrame::evaluateJavaScript to evaluate the jQuery JavaScript code. A <a href="qmainwindow.html">QMainWindow</a> with a <a href="qwebview.html">QWebView</a> as central widget builds up the browser itself.</p>
<a name="mainwindow-class-definition"></a>
<h2>MainWindow Class Definition</h2>
<p>The <tt>MainWindow</tt> class inherits <a href="qmainwindow.html">QMainWindow</a>. It implements a number of slots to perform actions on both the application and on the web content.</p>
<pre class="cpp"> <span class="keyword">class</span> MainWindow : <span class="keyword">public</span> <span class="type"><a href="qmainwindow.html">QMainWindow</a></span>
 {
     Q_OBJECT

 <span class="keyword">public</span>:
     MainWindow(<span class="keyword">const</span> <span class="type"><a href="qurl.html">QUrl</a></span><span class="operator">&amp;</span> url);

 <span class="keyword">protected</span> <span class="keyword">slots</span>:

     <span class="type">void</span> adjustLocation();
     <span class="type">void</span> changeLocation();
     <span class="type">void</span> adjustTitle();
     <span class="type">void</span> setProgress(<span class="type">int</span> p);
     <span class="type">void</span> finishLoading(<span class="type">bool</span>);

     <span class="type">void</span> viewSource();
     <span class="type">void</span> slotSourceDownloaded();

     <span class="type">void</span> highlightAllLinks();
     <span class="type">void</span> rotateImages(<span class="type">bool</span> invert);
     <span class="type">void</span> removeGifImages();
     <span class="type">void</span> removeInlineFrames();
     <span class="type">void</span> removeObjectElements();
     <span class="type">void</span> removeEmbeddedElements();

 <span class="keyword">private</span>:
     <span class="type"><a href="qstring.html">QString</a></span> jQuery;
     <span class="type"><a href="qwebview.html">QWebView</a></span> <span class="operator">*</span>view;
     <span class="type"><a href="qlineedit.html">QLineEdit</a></span> <span class="operator">*</span>locationEdit;
     <span class="type"><a href="qaction.html">QAction</a></span> <span class="operator">*</span>rotateAction;
     <span class="type">int</span> progress;</pre>
<p>We also declare a <a href="qstring.html">QString</a> that contains the jQuery, a <a href="qwebview.html">QWebView</a> that displays the web content, and a <a href="qlineedit.html">QLineEdit</a> that acts as the address bar.</p>
<a name="mainwindow-class-implementation"></a>
<h2>MainWindow Class Implementation</h2>
<p>We start by implementing the constructor.</p>
<pre class="cpp"> MainWindow<span class="operator">::</span>MainWindow(<span class="keyword">const</span> <span class="type"><a href="qurl.html">QUrl</a></span><span class="operator">&amp;</span> url)
 {
     progress <span class="operator">=</span> <span class="number">0</span>;

     <span class="type"><a href="qfile.html">QFile</a></span> file;
     file<span class="operator">.</span>setFileName(<span class="string">&quot;:/jquery.min.js&quot;</span>);
     file<span class="operator">.</span>open(<span class="type"><a href="qiodevice.html">QIODevice</a></span><span class="operator">::</span>ReadOnly);
     jQuery <span class="operator">=</span> file<span class="operator">.</span>readAll();
     file<span class="operator">.</span>close();</pre>
<p>The first part of the constructor sets the value of <tt>progress</tt> to 0. This value will be used later in the code to visualize the loading of a webpage.</p>
<p>Next, the jQuery library is loaded using a <a href="qfile.html">QFile</a> and reading the file content. The jQuery library is a JavaScript library that provides different functions for manipulating HTML.</p>
<pre class="cpp">     view <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qwebview.html">QWebView</a></span>(<span class="keyword">this</span>);
     view<span class="operator">-</span><span class="operator">&gt;</span>load(url);
     connect(view<span class="operator">,</span> SIGNAL(loadFinished(<span class="type">bool</span>))<span class="operator">,</span> SLOT(adjustLocation()));
     connect(view<span class="operator">,</span> SIGNAL(titleChanged(<span class="type"><a href="qstring.html">QString</a></span>))<span class="operator">,</span> SLOT(adjustTitle()));
     connect(view<span class="operator">,</span> SIGNAL(loadProgress(<span class="type">int</span>))<span class="operator">,</span> SLOT(setProgress(<span class="type">int</span>)));
     connect(view<span class="operator">,</span> SIGNAL(loadFinished(<span class="type">bool</span>))<span class="operator">,</span> SLOT(finishLoading(<span class="type">bool</span>)));

     locationEdit <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlineedit.html">QLineEdit</a></span>(<span class="keyword">this</span>);
     locationEdit<span class="operator">-</span><span class="operator">&gt;</span>setSizePolicy(<span class="type"><a href="qsizepolicy.html">QSizePolicy</a></span><span class="operator">::</span>Expanding<span class="operator">,</span> locationEdit<span class="operator">-</span><span class="operator">&gt;</span>sizePolicy()<span class="operator">.</span>verticalPolicy());
     connect(locationEdit<span class="operator">,</span> SIGNAL(returnPressed())<span class="operator">,</span> SLOT(changeLocation()));

     <span class="type"><a href="qtoolbar.html">QToolBar</a></span> <span class="operator">*</span>toolBar <span class="operator">=</span> addToolBar(tr(<span class="string">&quot;Navigation&quot;</span>));
     toolBar<span class="operator">-</span><span class="operator">&gt;</span>addAction(view<span class="operator">-</span><span class="operator">&gt;</span>pageAction(<span class="type"><a href="qwebpage.html">QWebPage</a></span><span class="operator">::</span>Back));
     toolBar<span class="operator">-</span><span class="operator">&gt;</span>addAction(view<span class="operator">-</span><span class="operator">&gt;</span>pageAction(<span class="type"><a href="qwebpage.html">QWebPage</a></span><span class="operator">::</span>Forward));
     toolBar<span class="operator">-</span><span class="operator">&gt;</span>addAction(view<span class="operator">-</span><span class="operator">&gt;</span>pageAction(<span class="type"><a href="qwebpage.html">QWebPage</a></span><span class="operator">::</span>Reload));
     toolBar<span class="operator">-</span><span class="operator">&gt;</span>addAction(view<span class="operator">-</span><span class="operator">&gt;</span>pageAction(<span class="type"><a href="qwebpage.html">QWebPage</a></span><span class="operator">::</span>Stop));
     toolBar<span class="operator">-</span><span class="operator">&gt;</span>addWidget(locationEdit);</pre>
<p>The second part of the constructor creates a <a href="qwebview.html">QWebView</a> and connects slots to the views signals. Furthermore, we create a <a href="qlineedit.html">QLineEdit</a> as the browsers address bar. We then set the horizontal <a href="qsizepolicy.html">QSizePolicy</a> to fill the available area in the browser at all times. We add the <a href="qlineedit.html">QLineEdit</a> to a <a href="porting4.html#qtoolbar">QToolbar</a> together with a set of navigation actions from QWebView::pageAction.</p>
<pre class="cpp">     <span class="type"><a href="qmenu.html">QMenu</a></span> <span class="operator">*</span>effectMenu <span class="operator">=</span> menuBar()<span class="operator">-</span><span class="operator">&gt;</span>addMenu(tr(<span class="string">&quot;&amp;Effect&quot;</span>));
     effectMenu<span class="operator">-</span><span class="operator">&gt;</span>addAction(<span class="string">&quot;Highlight all links&quot;</span><span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(highlightAllLinks()));

     rotateAction <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qaction.html">QAction</a></span>(<span class="keyword">this</span>);
     rotateAction<span class="operator">-</span><span class="operator">&gt;</span>setIcon(style()<span class="operator">-</span><span class="operator">&gt;</span>standardIcon(<span class="type"><a href="qstyle.html">QStyle</a></span><span class="operator">::</span>SP_FileDialogDetailedView));
     rotateAction<span class="operator">-</span><span class="operator">&gt;</span>setCheckable(<span class="keyword">true</span>);
     rotateAction<span class="operator">-</span><span class="operator">&gt;</span>setText(tr(<span class="string">&quot;Turn images upside down&quot;</span>));
     connect(rotateAction<span class="operator">,</span> SIGNAL(toggled(<span class="type">bool</span>))<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(rotateImages(<span class="type">bool</span>)));
     effectMenu<span class="operator">-</span><span class="operator">&gt;</span>addAction(rotateAction);

     <span class="type"><a href="qmenu.html">QMenu</a></span> <span class="operator">*</span>toolsMenu <span class="operator">=</span> menuBar()<span class="operator">-</span><span class="operator">&gt;</span>addMenu(tr(<span class="string">&quot;&amp;Tools&quot;</span>));
     toolsMenu<span class="operator">-</span><span class="operator">&gt;</span>addAction(tr(<span class="string">&quot;Remove GIF images&quot;</span>)<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(removeGifImages()));
     toolsMenu<span class="operator">-</span><span class="operator">&gt;</span>addAction(tr(<span class="string">&quot;Remove all inline frames&quot;</span>)<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(removeInlineFrames()));
     toolsMenu<span class="operator">-</span><span class="operator">&gt;</span>addAction(tr(<span class="string">&quot;Remove all object elements&quot;</span>)<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(removeObjectElements()));
     toolsMenu<span class="operator">-</span><span class="operator">&gt;</span>addAction(tr(<span class="string">&quot;Remove all embedded elements&quot;</span>)<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(removeEmbeddedElements()));

     setCentralWidget(view);
     setUnifiedTitleAndToolBarOnMac(<span class="keyword">true</span>);
 }</pre>
<p>The third and last part of the constructor implements two QMenus and assigns a set of actions to them. The last line sets the <a href="qwebview.html">QWebView</a> as the central widget in the <a href="qmainwindow.html">QMainWindow</a>.</p>
<pre class="cpp"> <span class="type">void</span> MainWindow<span class="operator">::</span>adjustLocation()
 {
     locationEdit<span class="operator">-</span><span class="operator">&gt;</span>setText(view<span class="operator">-</span><span class="operator">&gt;</span>url()<span class="operator">.</span>toString());
 }

 <span class="type">void</span> MainWindow<span class="operator">::</span>changeLocation()
 {
     <span class="type"><a href="qurl.html">QUrl</a></span> url <span class="operator">=</span> <span class="type"><a href="qurl.html">QUrl</a></span>(locationEdit<span class="operator">-</span><span class="operator">&gt;</span>text());
     view<span class="operator">-</span><span class="operator">&gt;</span>load(url);
     view<span class="operator">-</span><span class="operator">&gt;</span>setFocus();
 }</pre>
<p>When the page is loaded, <tt>adjustLocation()</tt> updates the address bar; <tt>adjustLocation()</tt> is triggered by the <tt>loadFinished()</tt> signal in <a href="qwebview.html">QWebView</a>. In <tt>changeLocation()</tt> we create a <a href="qurl.html">QUrl</a> object, and then use it to load the page into the <a href="qwebview.html">QWebView</a>. When the new web page has finished loading, <tt>adjustLocation()</tt> will be run once more to update the address bar.</p>
<pre class="cpp"> <span class="type">void</span> MainWindow<span class="operator">::</span>adjustTitle()
 {
     <span class="keyword">if</span> (progress <span class="operator">&lt;</span><span class="operator">=</span> <span class="number">0</span> <span class="operator">|</span><span class="operator">|</span> progress <span class="operator">&gt;</span><span class="operator">=</span> <span class="number">100</span>)
         setWindowTitle(view<span class="operator">-</span><span class="operator">&gt;</span>title());
     <span class="keyword">else</span>
         setWindowTitle(<span class="type"><a href="qstring.html">QString</a></span>(<span class="string">&quot;%1 (%2%)&quot;</span>)<span class="operator">.</span>arg(view<span class="operator">-</span><span class="operator">&gt;</span>title())<span class="operator">.</span>arg(progress));
 }

 <span class="type">void</span> MainWindow<span class="operator">::</span>setProgress(<span class="type">int</span> p)
 {
     progress <span class="operator">=</span> p;
     adjustTitle();
 }</pre>
<p><tt>adjustTitle()</tt> sets the window title and displays the loading progress. This slot is triggered by the <tt>titleChanged()</tt> signal in <a href="qwebview.html">QWebView</a>.</p>
<pre class="cpp"> <span class="type">void</span> MainWindow<span class="operator">::</span>finishLoading(<span class="type">bool</span>)
 {
     progress <span class="operator">=</span> <span class="number">100</span>;
     adjustTitle();
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(jQuery);

     rotateImages(rotateAction<span class="operator">-</span><span class="operator">&gt;</span>isChecked());
 }</pre>
<p>When a web page has loaded, <tt>finishLoading()</tt> is triggered by the <tt>loadFinished()</tt> signal in <a href="qwebview.html">QWebView</a>. <tt>finishLoading()</tt> then updates the progress in the title bar and calls <tt>evaluateJavaScript()</tt> to evaluate the jQuery library. This evaluates the JavaScript against the current web page. What that means is that the JavaScript can be viewed as part of the content loaded into the <a href="qwebview.html">QWebView</a>, and therefore needs to be loaded every time a new page is loaded. Once the jQuery library is loaded, we can start executing the different jQuery functions in the browser.</p>
<p>The rotateImages() function is then called explicitely to make sure that the images of the newly loaded page respect the state of the toggle action.</p>
<pre class="cpp"> <span class="type">void</span> MainWindow<span class="operator">::</span>highlightAllLinks()
 {
     <span class="type"><a href="qstring.html">QString</a></span> code <span class="operator">=</span> <span class="string">&quot;$('a').each( function () { $(this).css('background-color', 'yellow') } )&quot;</span>;
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(code);
 }</pre>
<p>The first jQuery-based function, <tt>highlightAllLinks()</tt>, is designed to highlight all links in the current webpage. The JavaScript code looks for web elements named <i>a</i>, which is the tag for a hyperlink. For each such element, the background color is set to be yellow by using CSS.</p>
<pre class="cpp"> <span class="type">void</span> MainWindow<span class="operator">::</span>rotateImages(<span class="type">bool</span> invert)
 {
     <span class="type"><a href="qstring.html">QString</a></span> code;
     <span class="keyword">if</span> (invert)
         code <span class="operator">=</span> <span class="string">&quot;$('img').each( function () { $(this).css('-webkit-transition', '-webkit-transform 2s'); $(this).css('-webkit-transform', 'rotate(180deg)') } )&quot;</span>;
     <span class="keyword">else</span>
         code <span class="operator">=</span> <span class="string">&quot;$('img').each( function () { $(this).css('-webkit-transition', '-webkit-transform 2s'); $(this).css('-webkit-transform', 'rotate(0deg)') } )&quot;</span>;
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(code);
 }</pre>
<p>The <tt>rotateImages()</tt> function rotates the images on the current web page. Webkit supports CSS transforms and this JavaScript code looks up all <i>img</i> elements and rotates the images 180 degrees and then back again.</p>
<pre class="cpp"> <span class="type">void</span> MainWindow<span class="operator">::</span>removeGifImages()
 {
     <span class="type"><a href="qstring.html">QString</a></span> code <span class="operator">=</span> <span class="string">&quot;$('[src*=gif]').remove()&quot;</span>;
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(code);
 }

 <span class="type">void</span> MainWindow<span class="operator">::</span>removeInlineFrames()
 {
     <span class="type"><a href="qstring.html">QString</a></span> code <span class="operator">=</span> <span class="string">&quot;$('iframe').remove()&quot;</span>;
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(code);
 }

 <span class="type">void</span> MainWindow<span class="operator">::</span>removeObjectElements()
 {
     <span class="type"><a href="qstring.html">QString</a></span> code <span class="operator">=</span> <span class="string">&quot;$('object').remove()&quot;</span>;
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(code);
 }

 <span class="type">void</span> MainWindow<span class="operator">::</span>removeEmbeddedElements()
 {
     <span class="type"><a href="qstring.html">QString</a></span> code <span class="operator">=</span> <span class="string">&quot;$('embed').remove()&quot;</span>;
     view<span class="operator">-</span><span class="operator">&gt;</span>page()<span class="operator">-</span><span class="operator">&gt;</span>mainFrame()<span class="operator">-</span><span class="operator">&gt;</span>evaluateJavaScript(code);
 }</pre>
<p>The remaining four methods remove different elements from the current web page. <tt>removeGifImages()</tt> removes all GIF images on the page by looking up the <i>src</i> attribute of all the elements on the web page. Any element with a <i>gif</i> file as its source is removed. <tt>removeInlineFrames()</tt> removes all <i>iframe</i> or inline elements. <tt>removeObjectElements()</tt> removes all <i>object</i> elements, and <tt>removeEmbeddedElements()</tt> removes any elements such as plugins embedded on the page using the <i>embed</i> tag.</p>
</div>
<!-- @@@webkit/fancybrowser -->
      </div>
    </div>
    </div> 
    <div class="ft">
      <span></span>
    </div>
  </div> 
  <div class="footer">
    <p>
      <acronym title="Copyright">&copy;</acronym> 2013 Digia Plc and/or its
      subsidiaries. Documentation contributions included herein are the copyrights of
      their respective owners.</p>
    <br />
    <p>
      The documentation provided herein is licensed under the terms of the
      <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation
      License version 1.3</a> as published by the Free Software Foundation.</p>
    <p>
      Documentation sources may be obtained from <a href="http://www.qt-project.org">
      www.qt-project.org</a>.</p>
    <br />
    <p>
      Digia, Qt and their respective logos are trademarks of Digia Plc 
      in Finland and/or other countries worldwide. All other trademarks are property
      of their respective owners. <a title="Privacy Policy"
      href="http://en.gitorious.org/privacy_policy/">Privacy Policy</a></p>
  </div>

  <script src="scripts/functions.js" type="text/javascript"></script>
</body>
</html>