Welcome to the RuneGlory Wiki, where we do our best to make your life easier!

You can use the search menu on the right side of the wiki (or at the bottom if you are on mobile) to search for the page you are looking for. The most popular pages can be found on the right side of the wiki aswell (or again at the bottom if you are on mobile).

Difference between revisions of "User:Jplayer"

From RuneGlory
Jump to: navigation, search
 
(24 intermediate revisions by the same user not shown)
Line 1: Line 1:
<h1>Imperdiet</h1>
+
<html>
 +
<!-- TEXT -->
 +
<p style="font-weight: bold;">Text</p>
 +
<input type="text" maxlength="30" value="Usertitle" id="text" class="update">
 +
<br>
 +
<br>
 +
<!-- COLOR -->
 +
<p style="font-weight: bold;">Color</p>
 +
<input id="color" type="color" value="#C0C0C0" class="update">
 +
<br>
 +
<br>
 +
<!-- GLOW COLOR -->
 +
<p style="font-weight: bold;">Glow Color</p>
 +
<input id="glowColor" type="color" value="#C0C0C0" class="update">
 +
<br>
 +
<br>
 +
<!-- GLOW RADIUS -->
 +
<p style="font-weight: bold;">Glow Radius</p>
 +
<div class="itemBackground"><input id="glowRadius" type="range" min="0" max="1000" value="1000" class="update"></div>
 +
<br>
 +
<!-- TEXT FORMATTING -->
 +
<p style="font-weight: bold;">Text Formatting</p>
 +
<div class="itemBackground" style="padding: 10px;">
 +
<label><input type="checkbox" id="bold" class="update" checked=""><div style="line-height: 20px;">Bold</div></label>
 +
<label><input type="checkbox" id="italic" class="update"><div style="line-height: 20px;">Italic</div></label>
 +
<label><input type="checkbox" id="strikethrough" class="update"><div style="line-height: 20px;">Strikethrough</div></label>
 +
<label><input type="checkbox" id="glitter" class="update"><div style="line-height: 20px;">Glitter</div></label>
 +
</div>
 +
<br>
 +
<!-- PREVIEW -->
 +
<p style="font-weight: bold;">Preview</p>
 +
<div style="padding: 30px; background-color: #1D1D1D; text-align: center; border: 1px solid #A2A2A2; font-size: 12px;">
 +
<span id="preview"></span>
 +
</div>
 +
<br>
 +
<!-- HTML CODE -->
 +
<p style="font-weight: bold;">HTML Code</p>
 +
<input type="text" id="code">
  
Imperdiet mauris viverra maecenas, tortor enim aliquam at nec. Pellentesque penatibus, sed rutrum viverra quisque pede, mauris commodo sodales enim porttitor. Magna convallis mi mollis, neque nostra mi vel volutpat lacinia, vitae blandit est, bibendum vel ut. Congue ultricies, libero velit amet magna erat. Orci in, eleifend venenatis lacus tincidunt nisl http://forum.grinderscape.org/forum.php malesuada tristique, cum egestas vel ac dapibus euismod suspendisse.
 
  
{| class="wikitable"
 
!Name
 
!Level to clean
 
!Experience gained
 
|-
 
|Guam
 
|1
 
|125
 
|-
 
|Marrentill
 
|5
 
|190
 
|-
 
|Tarromin
 
|11
 
|250
 
|-
 
|Harralander
 
|20
 
|315
 
|-
 
|Ranarr
 
|25
 
|375
 
|-
 
|Toadflax
 
|30
 
|2800
 
|-
 
|Irit
 
|40
 
|440
 
|-
 
|Avantoe
 
|48
 
|1500
 
|-
 
|Kwuarm
 
|54
 
|1695
 
|-
 
|Snapdragon
 
|59
 
|4720
 
|-
 
|Cadantine
 
|65
 
|1875
 
|-
 
|Lantadyme
 
|67
 
|5895
 
|-
 
|Dwarf Weed
 
|70
 
|3450
 
|-
 
|Torstol
 
|75
 
|4500
 
|}
 
  
<h2>Suspendisse</h2>
 
  
Lorem ipsum dolor sit amet, mauris suspendisse viverra eleifend tortor tellus suscipit, tortor aliquet at nulla mus, dignissim neque, nulla neque. Ultrices proin mi urna nibh ut, aenean sollicitudin etiam libero nisl, ultrices ridiculus in magna purus consequuntur, ipsum donec orci ad vitae pede, id odio. Turpis venenatis at laoreet. Etiam commodo fusce in diam feugiat, nullam suscipit tortor per velit viverra minim sed metus egestas sapien consectetuer, ac etiam bibendum cras posuere pede placerat, velit neque felis. Turpis ut mollis, elit et vestibulum mattis integer aenean nulla, in vitae id augue vitae. Lacus eu nulla ante lorem, viverra pretium ipsum etiam, platea nec purus malesuada id leo, aliquam metus, ac velit viverra. Imperdiet mauris viverra maecenas, tortor enim aliquam at nec. Pellentesque penatibus, sed rutrum viverra quisque pede, mauris commodo sodales enim porttitor. Magna convallis mi mollis, neque nostra mi vel volutpat lacinia, vitae blandit est, bibendum vel ut. Congue ultricies, libero velit amet magna erat. Orci in, eleifend venenatis lacus tincidunt nisl malesuada tristique, cum egestas vel ac dapibus euismod suspendisse. Lorem ipsum dolor sit amet, mauris suspendisse viverra eleifend tortor tellus suscipit, tortor aliquet at nulla mus, dignissim neque, nulla neque.
 
  
https://i.imgur.com/p28oEjv.png
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 +
<script type="text/javascript">
  
velit viverra minim sed metus egestas sapien consectetuer, ac etiam bibendum cras posuere pede placerat, velit neque felis. Turpis ut mollis, elit et vestibulum mattis integer aenean nulla, in vitae id augue vitae. Lacus eu nulla ante lorem, viverra pretium ipsum etiam, platea nec purus malesuada id leo, aliquam metus, ac velit viverra.
+
update();
  
Imperdiet mauris viverra maecenas, tortor enim aliquam at nec. Pellentesque penatibus, sed rutrum viverra quisque pede, mauris commodo sodales enim porttitor. Magna convallis mi mollis, neque nostra mi vel volutpat lacinia, vitae blandit est, bibendum vel ut. Congue ultricies, libero velit amet magna erat. Orci in, eleifend venenatis lacus tincidunt nisl malesuada tristique, cum egestas vel ac dapibus euismod suspendisse.
+
$( "input.update" ).change( function() {
 +
update();
 +
});
  
<h2>Sollicitudin</h2>
+
function update() {
  
Ultrices proin mi urna nibh ut, aenean sollicitudin etiam libero nisl, ultrices ridiculus in magna purus consequuntur, ipsum donec orci ad vitae pede, id odio. Turpis venenatis at laoreet. Etiam commodo fusce in diam feugiat, nullam suscipit tortor per! Orci in, eleifend venenatis lacus tincidunt nisl malesuada tristique, cum egestas vel ac dapibus euismod suspendisse. Lorem ipsum dolor sit amet, mauris suspendisse viverra eleifend tortor tellus suscipit, tortor aliquet at nulla mus, dignissim neque, nulla neque. Ultrices proin mi urna nibh ut, aenean sollicitudin etiam libero nisl, ultrices ridiculus in magna purus consequuntur, ipsum donec orci ad vitae pede, id odio. Turpis venenatis at laoreet. Etiam commodo fusce in diam feugiat, nullam suscipit tortor per!
+
var text = $( "input#text" ).val();
 +
var color = $( "input#color" ).val();
 +
var glowColor = $( "input#glowColor" ).val();
 +
var glowRadius = $( "input#glowRadius" ).val() / 100;
  
Imperdiet mauris viverra maecenas, tortor enim aliquam at nec. Pellentesque penatibus, sed rutrum viverra quisque pede, mauris commodo sodales enim porttitor. Magna convallis mi mollis, neque nostra mi vel volutpat lacinia, vitae blandit est, bibendum vel ut. Congue ultricies, libero velit amet magna erat. Orci in, eleifend venenatis lacus tincidunt nisl malesuada tristique, cum egestas vel ac dapibus euismod suspendisse.
+
// TEXT SHADOW
  
* Imperdiet mauris viverra maecenas.
+
if ( glowRadius == 0 ) {
* Imperdiet mauris viverra maecenas.
+
var textShadow = "text-shadow: none;";
** Imperdiet mauris viverra maecenas.
+
} else {
** Imperdiet mauris viverra maecenas.
+
var textShadow = "text-shadow: 0 0 " + glowRadius + "px " + glowColor + ";";
*** Imperdiet mauris viverra maecenas.
+
}
*** Imperdiet mauris viverra maecenas.
 
** Imperdiet mauris viverra maecenas.
 
*** Imperdiet mauris viverra maecenas.
 
*** Imperdiet mauris viverra maecenas.
 
*** Imperdiet mauris viverra maecenas.
 
** Imperdiet mauris viverra maecenas.
 
* Imperdiet mauris viverra maecenas.
 
** Imperdiet mauris viverra maecenas.
 
** Imperdiet mauris viverra maecenas.
 
*** Imperdiet mauris viverra maecenas.
 
**** Imperdiet mauris viverra maecenas.
 
  
<html><iframe width="854" height="480" src="https://www.youtube.com/embed/fDrTbLXHKu8?list=PLQNYLBeSzKZueKk_y3uM7OFquFmefEMig" frameborder="0" allowfullscreen></iframe></html>
+
// TEXT FORMATTING
<div id="index">
+
 
<div class="index-title">Index</div>
+
if ( $( "input#bold" ).is( ":checked" ) ) {
<div class="index-item">
+
var fontWeight = "bold;";
https://i.imgur.com/e3lPRWS.png
+
} else {
<p>[[User:Jplayer/Subpage]]<br>Last modified by {{REVISIONUSER: User:Jplayer/Subpage }}.</p>
+
var fontWeight = "normal;";
</div>
+
}
<div class="index-item">
+
 
https://i.imgur.com/ciQoyyC.png
+
if ( $( "input#italic" ).is( ":checked" ) ) {
<p>[[User:Jplayer/Subpage]]<br>Last modified by {{REVISIONUSER: User:Jplayer/Subpage }}.</p>
+
var fontStyle = "italic;";
</div>
+
} else {
<div class="index-item">
+
var fontStyle = "initial;";
https://i.imgur.com/WMnpjp9.png
+
}
<p>[[User:Jplayer/Subpage]]<br>Last modified by {{REVISIONUSER: User:Jplayer/Subpage }}.</p>
+
 
</div>
+
if ( $( "input#strikethrough" ).is( ":checked" ) ) {
<div class="index-item">
+
var textDecoration = "line-through;";
https://i.imgur.com/v7CM3yV.png
+
} else {
<p>[[User:Jplayer/Subpage]]<br>Last modified by {{REVISIONUSER: User:Jplayer/Subpage }}.</p>
+
var textDecoration = "initial;";
</div>
+
}
<div class="index-item">
+
 
https://i.imgur.com/C118Zx0.png
+
if ( $( "input#glitter" ).is( ":checked" ) ) {
<p>[[User:Jplayer/Subpage]]<br>Last modified by {{REVISIONUSER: User:Jplayer/Subpage }}.</p>
+
var background = "url(http://forum.grinderscape.org/images/Crowns/Glitter.gif);";
</div>
+
} else {
<div class="index-item">
+
var background = "none;";
https://i.imgur.com/rAX78mz.png
+
}
<p>[[User:Jplayer/Subpage]]<br>Last modified by {{REVISIONUSER: User:Jplayer/Subpage }}.</p>
+
 
</div>
+
var textFormatting = "font-weight:" + fontWeight + "font-style:" + fontStyle + "text-decoration:" + textDecoration + "background:" + background;
</div>
+
 
 +
var style = "color:" + color + ";" + textShadow + textFormatting;
 +
$( "span#preview" ).html( text ).attr( "style", style );
 +
 
 +
$( "input#code" ).val( "<span style='" + style + "'>" + text + "</span>"  );
 +
 
 +
}
 +
 
 +
</script>
 +
</html>

Latest revision as of 00:25, 27 May 2016

Text



Color



Glow Color



Glow Radius


Text Formatting


Preview


HTML Code