Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Voodoo Tech and Scripter's Den of Scriptniquity > JQuery & CSS Annotation on Forum Signature
ransim (New Admin) 11/21/2008 9:02 AM EST : JQuery & CSS Annotation on Forum Signature
ransim
Posts: 1093
Zomgawsh Poster

I'm using JQuery to load content from our Forums into a page when a link is clicked.

I'll try not to get too complex, but basically when the link for the name is click on the left, it goes to the forum post, traverses the DOM, gives me all of the content in the first forum post, then dumps it into the right hand frame.

The problem I'm running into is I can't easily parse out the forum signature because it doesn't had an ID or a class. Could I get a id added to that div...

Please?

Also if anyone is interested in the code to do this I'd be happy to provide it.
TopBottom

Mottie (MVP) 11/25/2008 2:11 AM EST : RE: JQuery & CSS Annotation on Forum Signature
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

I was trying to look at your S.C.O.R.P.I.O. site and couldn't see what you are trying to describe. It's sounds like a good idea 

Anyway, I wrote a script in jQuery to add a class name to the sig... I called it "sigBox" but you can change that to whatever you want. All it does is looks for a div inside the message body with the "padding-top" style.
<style type="text/css">
.sigBox {background:#ffcc00;}
</style>
<script type="text/javascript">
$(document).ready(function() {

 $(".MessageBodyCell1 > div").each(function(){
   if ($(this).css("padding-top") == "10px") {
    $(this).addClass("sigBox");
   }
 })

});
</script>
I hope that helps!
TopBottom

ransim (New Admin) 12/4/2008 6:28 AM EST : RE: JQuery & CSS Annotation on Forum Signature
ransim
Posts: 1093
Zomgawsh Poster

Going to try that.

Yeah I just realized someone stealth renamed the section on me. *shakes fist*

The link however is:
http://scorpio.guildportal.com/Guild.aspx?GuildID=106370&TabID=2341193

Basically the links in the left hand box are to forum articles, when clicked it grabs the first post from the forum thread specified and replaces the content in the div on the right hand side with said content.

I'd post the code but this thing seems to not want to let me...

The left hand box is just a normal list of links. Its nice, and makes it easy for people to add content to the page as long as its a existing forum post.

Works like this:
  1. Create a post in the forum. Copy the URL.
  2. Go to the page, add a link on the left to the forum post.
  3. Reload the page
  4. Click a link. When the link is clicked the script basically knows to load the content from the link, the traverse the DOM of the target and plop the content in the specified source div to the target div inside the right box.
TopBottom

Mottie (MVP) 12/4/2008 6:36 AM EST : RE: JQuery & CSS Annotation on Forum Signature
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Your link doesn't allow public access, so I can't see it.

To post code in the forums, all you need to do is "colorize" the word "script" to get it to post... in the script below, I colored the word in blue so you can see.
<script type="text/javascript">
("hello");
</script>
TopBottom

ransim (New Admin) 12/4/2008 8:54 AM EST : RE: JQuery & CSS Annotation on Forum Signature
ransim
Posts: 1093
Zomgawsh Poster

Weird, not sure why someone set that to locked access...

*headdesk*

Its fixed now so you should be able to see it. Content for the main body (where you want content to load is

<script type="text/javascript">
$(document).ready(function() {
    $('.LeftContentZone a').click(function(){
                                 
        var toLoad = $(this).attr('href')+' td.MessageBodyCell1:first';
        $('#content').show('fast',loadContent);
        function loadContent() {
            $('#content').load(toLoad,'')
        }
        return false;
       
    });

});   
</script>

<div id="content">
Stuff to replace here
</div>
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%