|
ReactJS</div>
<script type="text/javascript" src="../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../jqwidgets/jqxpanel.js"></script>
<script type="text/javascript" src="../scripts/demos.js"></script>
<style>
html, body, #app {
width: 100%;
height: 100%;
overflow: hidden;
}
</style>
<div style="height: 800px;">
<div class="example-description" style="margin-bottom: 3em">
ReactJS Panel demo. jqxPanel Fluid Size Example. The width and height of the Panel in this demo are in Percentages.
</div>
<div id="app"></div>
<script src="../build/panel_fluidsize.bundle.js"></script>
</div>
</div>
</td>
</tr>
</table>
</div>
<div style="overflow-x: auto; overflow-y: hidden;" id="tabs-2"><pre style='border:none !important; padding: 0px !important; overflow: auto; margin-top: 5px; margin-bottom: 5px;' class='code'><code><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><!DOCTYPE html></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><html></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><head></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><meta charset=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"utf-8"</span> /></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><title></span>
ReactJS Panel demo. jqxPanel Fluid Size Example. The width and height of the Panel in <span style="color: #11a;">this </span>demo are in Percentages.
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></title></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css"</span> /></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><script type=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"text/javascript" src="../jqwidgets/jqxcore.js"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></script></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><script type=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"text/javascript" src="../jqwidgets/jqxscrollbar.js"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></script></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><script type=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"text/javascript" src="../jqwidgets/jqxbuttons.js"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></script></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><script type=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"text/javascript" src="../jqwidgets/jqxpanel.js"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></script></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><script type=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"text/javascript" src="../scripts/demos.js"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></script></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><style></span>
html, body, #app {
<span style="color: #666b74;">width:</span> 100%;
<span style="color: #666b74;">height:</span> 100%;
overflow: hidden;
}
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></style></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></head></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><body></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div class=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"example-description" style="margin-bottom: 3em"</span>></span>
ReactJS Panel demo. jqxPanel Fluid Size Example. The width and height of the Panel in <span style="color: #11a;">this </span>demo are in Percentages.
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div id=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"app"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><script src=<span style="clear: both; padding: 0px; margin: 0px; color: #080;">"../build/panel_fluidsize.bundle.js"</span>></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></script></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></body></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></html></span>
</code></pre>
</div>
<div style="overflow: auto;" id="tabs-3"><pre style='border:none !important; padding: 0px !important; overflow: auto; margin-top: 5px; margin-bottom: 5px;' class='code'><code>import React from <span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'react'</span>;
import ReactDOM from <span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'react-dom'</span>;
import JqxPanel from <span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'../../../jqwidgets-react/react_jqxpanel.js'</span>;
class App extends React.Component {
render () {
let innerHtml =
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div style=\'margin: 10px;\'></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><h3></span>Early History of the Internet<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></h3></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><span style="clear: both; padding: 0px; margin: 0px; color: #080;"><!--Content--></span></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div style=\'white-space: nowrap;\'></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><ul></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1961 First packet-switching papers<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1966 Merit Network founded<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1966 ARPANET planning starts<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1969 ARPANET carries its first packets<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1970 Mark I network at NPL (UK)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1970 Network Information Center (NIC)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1971 Merit Network\'s packet-switched network operational<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1971 Tymnet packet-switched network<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1972 Internet Assigned Numbers Authority (IANA) established<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1973 CYCLADES network demonstrated<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1974 Telenet packet-switched network<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1976 X.25 protocol approved<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1979 Internet Activities Board (IAB)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1980 USENET news using UUCP<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1980 Ethernet standard introduced<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1981 BITNET established<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></ul></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><span style="clear: both; padding: 0px; margin: 0px; color: #080;"><!--Header--></span></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div style=\'margin: 10px;\'></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><h3></span>Merging the networks and creating the Internet<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></h3></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><span style="clear: both; padding: 0px; margin: 0px; color: #080;"><!--Content--></span></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><ul></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1981 Computer Science Network (CSNET)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1982 TCP/IP protocol suite formalized<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1982 Simple Mail Transfer Protocol (SMTP)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1983 Domain Name System (DNS)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1983 MILNET split off from ARPANET<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1986 NSFNET <span style="color: #11a;">with </span>56 kbit/s links<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1986 Internet Engineering Task Force (IETF)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1987 UUNET founded<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1988 NSFNET upgraded to 1.5 Mbit/s (T1)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1988 OSI Reference Model released<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1988 Morris worm<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1989 Border Gateway Protocol (BGP)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1989 PSINet founded, allows commercial traffic<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1989 Federal Internet Exchanges (FIXes)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1990 GOSIP (without TCP/IP)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1990 ARPANET decommissioned<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></ul></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><span style="clear: both; padding: 0px; margin: 0px; color: #080;"><!--Header--></span></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div style=\'margin: 10px;\'></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><h3></span>Popular Internet services<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></h3></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><span style="clear: both; padding: 0px; margin: 0px; color: #080;"><!--Content--></span></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><ul></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1990 IMDb Internet movie database<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1995 Amazon.com online retailer<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1995 eBay online auction and shopping<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1995 Craigslist classified advertisements<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1996 Hotmail free web-based e-mail<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1997 Babel Fish automatic translation<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1998 Google Search<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1999 Napster peer-to-peer file sharing<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2001 Wikipedia, the free encyclopedia<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2003 LinkedIn business networking<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2003 Myspace social networking site<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2003 Skype Internet voice calls<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2003 iTunes Store<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2004 Facebook social networking site<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2004 Podcast media file series<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2004 Flickr image hosting<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2005 YouTube video sharing<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>2005 Google Earth virtual globe<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></ul></span>'</span> +
<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>'</span>;
<span style="color: #11a;">return </span>(
<JqxPanel
width={<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'50%'} height={'50%'</span>}
>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div style={{ margin: 10 }}></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><h3></span>Early History of the Internet<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></h3></span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><div style={{ whiteSpace: <span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'nowrap'</span> }}></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><ul></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1961 First packet-switching papers<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1966 Merit Network founded<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1966 ARPANET planning starts<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1969 ARPANET carries its first packets<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1970 Mark I network at NPL (UK)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1970 Network Information Center (NIC)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1971 Merit Network's packet-switched network operational<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1971 Tymnet packet-switched network<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1972 Internet Assigned Numbers Authority (IANA) established<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1973 CYCLADES network demonstrated<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1974 Telenet packet-switched network<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1976 X.25 protocol approved<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1979 Internet Activities Board (IAB)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1980 USENET news using UUCP<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1980 Ethernet standard introduced<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><li></span>1981 BITNET established<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></li></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></ul></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></div></span>
<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"></JqxPanel></span>
)
}
}
<span style="clear: both; padding: 0px; margin: 0px; color: #a533d4;">//template={innerHtml}</span>
ReactDOM.render(<span style="clear: both; padding: 0px; margin: 0px; color: #11a;"><App /></span>, document.getElementById(<span style=" clear: both; padding: 0px; margin: 0px; color: #080;">'app'</span>));
</code></pre>
</div>
</div>
<div id="introduction"></div></div></div></div>
<div id="pageBottom">
<!-- FOOTER START -->
<div class="footer" role="contentinfo">
<div class="wrap cf">
<a class="footer-logo" href="/">
<img src="../resources/design/i/logo-jqwidgets-white.svg" width="234" height="48" alt="jQWidgets" />
</a>
<ul class="nav socials">
<li>
<a href="https://www.facebook.com/jQWidgets-282600545090250/" target="_blank">
<span class="fb"></span>Facebook
</a>
</li>
<li>
<a href="https://twitter.com/jqwidgets" target="_blank">
<span class="tw"></span>Youtube
</a>
</li>
<li>
<a href="https://plus.google.com/112258917836957242269" target="_blank">
<span class="gp"></span>Google +
</a>
</li>
</ul>
<nav class="nav" role="navigation">
<ul>
<li>
<a href="../../../jquery-widgets-demo">Demo</a>
</li>
<li>
<a href="../../../download">Download</a>
</li>
<li>
<a href="../../../jquery-widgets-documentation/">Documentation</a>
</li>
<li>
<a href="../../../license">License and Pricing</a>
</li>
<li>
<a href="../../../services">Services</a>
</li>
</ul>
<ul>
<li>
<a href="../../../community">Forums</a>
</li>
<li>
<a href="../../../about">About</a>
</li>
<li>
<a href="../../../terms-of-us">Terms of Use</a>
</li>
<li>
<a href="../../../privacy">Privacy Policy</a>
</li>
<li>
<a href="../../../contact-us">Contact Us</a>
</li>
</ul>
</nav>
<p>jQWidgets © 2011-2019. All Rights Reserved.</p>
</div>
</div>
<!-- FOOTER END -->
</div>
</body>
</html> |
