JavaScript/CSS adding picture For VM notification.

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/CSS adding picture For VM notification. VmS_zps0c0e096e


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
avatar
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.


JavaScript/CSS adding picture For VM notification. Slgray10

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

Male Posts : 45670
Reputation : 3219
Language : English
Location : United States

https://help.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:
JavaScript/CSS adding picture For VM notification. Bluebox_zps0fdc1247

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://illiweb.com/fa/pbucket.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!
avatar
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
Sanket
ForumGuru

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

Back to top Go down

Back to top


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