Directions for drop down style swapper



sibyls simple stuff
November 18, 2018, 02:57:57 pm
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Registration is DISABLED.   The forum is for storage purposes only.
 
  Home Help Search Arcade Login Register  

Xtra Smileys - Smiley Box is Draggable

Pages: [1]
  Print  
Author Topic: Xtra Smileys - Smiley Box is Draggable  (Read 2808 times)
simply sibyl
Admin
*
Gender: Female
Posts: 106



« on: December 13, 2007, 06:46:34 am »

IMPORTANT:    Before you go further read the following:

You have to have your own webpace or a place that will let you host two .js files for this to work.
Do not use the links I provide in the directions as bandwidth is limited with them and the smiley box will NOT drag if you use them.

This looks exactly like my original Xtra Smileys but with this one you can put your mouse on the smiley box and drag it down to the post area.  The smileys are clickable to add the code for them to a post.

Instructions:

The smileys in this are the smf smileys that you see  at support.

If you want to use your own smileys:

Look at the code and find the sections that look like this:

Code:
<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/police.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/police.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

There is one of these sections for each smiley  - 30 total
(you can add/subtract these sections depending on how many you want)

Replace BOTH urls with your smiley url being very careful to leave all quotes.
Do this for each section in the code.

IMPORTANT:

Do to bandwidth limitations you HAVE to  download the two .js files and upload them to your own host, then replace the links.   NOTE:    the smiley box will not drag and will error if you do not replace the two js links with your own.

You can download them both from here:

http://members.cox.net/mysmileyplace/ui.mouse.zip
http://members.cox.net/mysmileyplace/ui.draggable.zip

You'll need to upload the files that are inside the zip files to your own space.

Put this in your header (REPLACE your links for the two .js files with your own links or this will NOT work for you)

Code:

<!--  Begin Show/Hide Smileys Place this code in your HEADER -->
<script src="jquery.js"></script>
<script src="http://your url/ui.mouse.js"></script>
<script src="http://your url/ui.draggable.js"></script>

<script>
  $(document).ready(function(){
    $(".dragsmileys").draggable();
  });
</script>

<script language="javascript">
  function toggle_it(itemID){
      // Toggle visibility between none and inline
      if ((document.getElementById(itemID).style.display == 'none'))
      {
        document.getElementById(itemID).style.display = 'inline';
      } else {
        document.getElementById(itemID).style.display = 'none';
      }
  }

</script>

<!--  Header Part of the Smileys Box -->

<table width="200px" class="tborder" cellpadding="1" cellspacing="1">
 <tr>
  <td  class="catbg">
    <center><a href="#smileys" onClick="toggle_it('prsmileys')"><small>Draggable Smileys</small> </a></center>
  </td>
 </tr>

</table>

<!--  The draggable part with the smileys on it -->

<div align="left" style="position: absolute;  z-index: 2; visibility: show;" class="dragsmileys">
   <table class="tborder" width="200px" id="prsmileys" style="display:none;"  align="left"
border="0">
    <tr>
    <td class="catbg" align="right">
    <a href="#smileys" onClick="toggle_it('prsmileys')"><small>[Close]</small></a>
    </td>
    </tr>

    <tr>
    <TD class="windowbg2" align="center" >
   
    <br>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/smiley.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/smiley.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/wink.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/wink.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/cheesy.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/cheesy.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/grin.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/grin.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/angry.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/angry.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/shocked.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/shocked.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/cool.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/cool.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/huh.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/huh.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/rolleyes.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/rolleyes.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/tongue.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/tongue.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/lipsrsealed.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/lipsrsealed.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/lipsrsealed.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/lipsrsealed.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/undecided.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/undecided.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/kiss.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/kiss.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/cry.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/cry.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/evil.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/evil.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/angel.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/angel.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/laugh.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/laugh.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/azn.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/azn.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/afro.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/afro.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/police.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/police.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/2funny.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/2funny.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/buck2.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/buck2.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/coolsmiley.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/coolsmiley.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/crazy2.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/crazy2.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/idiot2.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/idiot2.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/knuppel2.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/knuppel2.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/smiley6600.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/smiley6600.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/tickedoff.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/tickedoff.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>

<a href="javascript:void(0);" onclick="surroundText('[img]', ' http://www.smfboards.com/Smileys//smf/uglystupid2.gif [/img]',
document.forms.postmodify.message); return false;"><img src="http://www.smfboards.com/Smileys//smf/uglystupid2.gif" align="bottom" 
alt="Insert Image" title="Insert Image" /></a>
    </td>
   </tr>
    <tr>
    <td class="catbg" align="center">
   <div style="cursor: move;"><small>Left Click - Drag Me</small></div>
    </td>
    </tr>

  </table>
 </div>
 
Report Spam   Logged



Pages: [1]
  Print  
 
Jump to:  

Powered by EzPortal
Bookmark this site! | Upgrade This Forum
SMF For Free - Create your own Forum | Buy traffic for your forum/website

Powered by SMF | SMF © 2016, Simple Machines
Privacy Policy