The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

JavaScript/CSS adding picture For VM notification.

View previous topic View next topic Go down

Solved JavaScript/CSS adding picture For VM notification.

Post by viper8421 on February 6th 2013, 1:26 am

So I have it set up for VM messages, but i want to replace the pop-up with this picture.



JavaScript code
Code:
var uid='';
var uname='';

function ddginit() {
    var x=document.getElementById('unl');
    x.style.display='none';
    uid=x.childNodes[0].href.substring(x.childNodes[0].href.indexOf('&u=')+3);
    uname=x.childNodes[0].innerHTML;
    x.innerHTML='<span id="uid">'+uid+'</span><span id="uname">'+uname+'</span>';
    document.body.insertBefore(x,document.body.firstChild);
}


$(function() {
  var url = 'u' + uid + 'wall',
      count, old;
  if (location.pathname.indexOf(url) >= 0) {
    count = $('.message-footer:first a:first')[0];
    if (count) {
      count = /s=(\d+)/.exec(count.href)[1];
      my_setcookie('bilde-vm', count);
    }
    return;
  }
  $('<div id="bilde-vm"></div>').hide().load(url + ' .message-footer:first a:first', function() {
    count = this.firstChild;
    old = my_getcookie('bilde-vm') || 0;
    if (count) {
      count = /s=(\d+)/.exec(count.href)[1];
      if (count > old) {
        $(this).html('<a href="' + url + '">You have a new visitor message</a>').prependTo(document.body).fadeIn();
      }
    }
  });
});


CSS code
Code:
/*VM Notification*/
#bilde-vm {
  position: fixed;
  top: 10px;
  left: 10px;
  background: E9E9E9;
  border: 1px solid #FFF;
  padding: 5px;
  z-index: 999;
  outline: 1px solid #444;
}
#bilde-vm a {
  color: #444;
  text-decoration: none;
  text-shadow: 0 1px 0 #FFF;
}
#bilde-vm a:hover {
  text-shadow: 0 -1px 0 #FFF;
}

All this code works, i just want to replace the popup now with a picture.


Last edited by viper8421 on February 6th 2013, 4:27 am; edited 1 time in total

viper8421
New Member

Posts : 13
Reputation : 1
Language : English

http://justdubsrefuge.omgforum.net

Back to top Go down

Solved Re: JavaScript/CSS adding picture For VM notification.

Post by SLGray on February 6th 2013, 2:49 am

Try replacing this part of the JavaScript
Code:
$(this).html('<a href="' + url + '">[b][color=#339933]You have a new visitor message[/color][/b]</a>').prependTo(document.body).fadeIn();
Change
Code:
[b][color=#339933]You have a new visitor message[/color][/b]
to what you want.

You do know that you do not get a pm. In the picture you said inbox.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35606
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Solved Re: JavaScript/CSS adding picture For VM notification.

Post by viper8421 on February 6th 2013, 4:06 am

@SLGray wrote:Try replacing this part of the JavaScript
Code:
$(this).html('<a href="' + url + '">[b][color=#339933]You have a new visitor message[/color][/b]</a>').prependTo(document.body).fadeIn();
Change
Code:
[b][color=#339933]You have a new visitor message[/color][/b]
to what you want.

You do know that you do not get a pm. In the picture you said inbox.

I tired that and it stays the way it was before. like this:


And yeah, it was just kinda refering to the VM "inbox"

EDIT: ahh I'm sorry, the other admin changed it so it was in the Announcements
the actual code is
Code:
<div id="LGvms" style="display:none">{USERLINK}</div>
<script type="text/javascript">
(function() {
    ('Visitor message notification pop up for Forumotion boards. Copyright © by AvacWeb. All Rights Reserved. Use and  modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.');
  var holder = document.getElementById('LGvms');
  var cookie = my_getcookie('LGvms') || 2000;
  var url = holder.firstChild.href + '&page_profil=messages';
  if(url.indexOf('&u=-1') > 0) return;
  jQuery(holder).load(url + ' #cp-main h1', function() {
      var nums = holder.firstChild.innerHTML.match(/[0-9]+/g);
      var totalVMs = parseInt(nums[nums.length-1]);
      if(totalVMs > cookie) {
        holder.innerHTML = '<a href="' + url + '">You have ' + (totalVMs - cookie) + ' new visitor messages.</a>';
        holder.style.display = '';
      }
      my_setcookie('LGvms', totalVMs, 1);
  });
})();</script>


EDIT #2:
I got it working, here was the solution
Code:

      if(totalVMs > cookie) {
        holder.innerHTML = '<img src="http://i139.photobucket.com/albums/q292/Sporadic_Bullet/VmS_zps0c0e096e.gif" alt="Pulpit rock" width="304" height="228">';
        holder.style.display = '';
      }</script>

I just did what you said to do but on this one. Thank you for your help!

viper8421
New Member

Posts : 13
Reputation : 1
Language : English

http://justdubsrefuge.omgforum.net

Back to top Go down

Solved Re: JavaScript/CSS adding picture For VM notification.

Post by Sanket on February 6th 2013, 4:43 am

Glad you posted the solution.
Topic Solved & Locked

Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum