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.

Problem with IPS Steps Javascript

View previous topic View next topic Go down

Solved Problem with IPS Steps Javascript

Post by Van-Helsing on April 14th 2015, 4:49 pm

Hello,
I am using the following code for IPS Steps in registration:

Code:

jQuery(document).ready(function() {
if(jQuery('.main-content.standalone:contains("Οι διαχειριστές και οι συντονιστές")').length) {jQuery('#pun-visit + .pun-crumbs').after('<div class="ipsSteps clearfix"><ul><li class="ipsSteps_active"><strong class="ipsSteps_title">Βήμα 1</strong><span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"> </span></li><li class="" style="width: 83px;">
<strong class="ipsSteps_title">Βήμα 2</strong><span class="ipsSteps_desc"> Λογαριασμός</span><span class="ipsSteps_arrow"> </span></li><li class="" style="width: 83px;"><strong class="ipsSteps_title">Βήμα 3</strong><span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow"> </span></li></ul></div>');}if(jQuery('.main #ucp div:contains("Πληροφορίες εγγραφής")').length) {jQuery('#pun-visit + .main #ucp div:contains("Πληροφορίες εγγραφής")').before('<div class="ipsSteps clearfix" style="margin-bottom: 8px;"><ul><li class=""><strong class="ipsSteps_title">Βήμα 1</strong><span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"> </span></li><li class="ipsSteps_active" style="width: 83px;"><strong class="ipsSteps_title">Βήμα 2</strong><span class="ipsSteps_desc">Ο λογαριασμός σας</span><span class="ipsSteps_arrow"> </span></li><li class="" style="width: 83px;"><strong class="ipsSteps_title">Βήμα 3</strong><span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow">&nbsp;</span></li></ul></div>');}});

On the first step the step bar displaying normally:


On the second & third step is not displaying:


Last edited by Black-Shadow on April 18th 2015, 12:03 am; edited 1 time in total

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by Van-Helsing on April 15th 2015, 5:12 pm

bump

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by Van-Helsing on April 16th 2015, 11:00 pm

Bump

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by SLGray on April 16th 2015, 11:58 pm

Is that code made for your forum's version?


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


SLGray
Administrator
Administrator

Male Posts : 36698
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by Van-Helsing on April 17th 2015, 12:05 am

Hello @SLGray,
Yes its written for f/m punbb forum version. I believe on the second and third steps the javascript is not finding the elements due my skin. I tried to find the elements but I confused somewhere and I just fix it only for the first step which I modified the element and I cant find the other two elements after some tries into the javascript.

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by SLGray on April 17th 2015, 9:32 pm

Have you tried asking for help from where you got the code?


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


SLGray
Administrator
Administrator

Male Posts : 36698
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by JScript on April 17th 2015, 10:14 pm

@SLGray wrote:Have you tried asking for help from where you got the code?
scratch -> What the fuck ?!?


@Black-Shadow

Hello!

The code contained errors in JavaScript and HTML, do a test with the fix what I did:
Code:

jQuery(function() {
   if (jQuery('.main-content.standalone:contains("Οι διαχειριστές και οι συντονιστές")').length) {
      jQuery('#pun-visit + .pun-crumbs').after(
         '<div class="ipsSteps clearfix">' +
         '   <ul>' +
         '      <li class="ipsSteps_active">' +
         '         <strong class="ipsSteps_title">Βήμα 1</strong>' +
         '            <span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;"> ' +
         '         <strong class="ipsSteps_title">Βήμα 2</strong>' +
         '            <span class="ipsSteps_desc">Λογαριασμός</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 3</strong>' +
         '         <span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '   </ul>' +
         '</div>'
      );
   }
   if (jQuery('#ucp div.main-head:contains("Πληροφορίες εγγραφής")').length) {
      jQuery('#ucp div.main-head:contains("Πληροφορίες εγγραφής")').before(
         '<div class="ipsSteps clearfix" style="margin-bottom: 8px;">' +
         '   <ul>' +
         '      <li>' +
         '         <strong class="ipsSteps_title">Βήμα 1</strong>' +
         '            <span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li class="ipsSteps_active" style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 2</strong>' +
         '         <span class="ipsSteps_desc">Ο λογαριασμός σας</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 3</strong>' +
         '         <span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow">&nbsp;</span>' +
         '      </li>' +
         '   </ul>' +
         '</div>'
      );
   };
});

Note: The code has been encoded in UTF8, if you have problems with encoding, let me know!

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by Van-Helsing on April 17th 2015, 11:04 pm

Hello @JScript @SLGray,
Now fixed and the step 2, on the third step is not displaying.

@SLGray yes I opened a code request on forum which i found the code but i havent any response yet.

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by JScript on April 17th 2015, 11:30 pm

@Black-Shadow
Simply because the code does not contain the third part!

But no problem, here is the code with the third part:
Code:

jQuery(function() {
   // 1
   if (jQuery('.main-content.standalone:contains("Οι διαχειριστές και οι συντονιστές")').length) {
      jQuery('#pun-visit + .pun-crumbs').after(
         '<div class="ipsSteps clearfix">' +
         '   <ul>' +
         '      <li class="ipsSteps_active">' +
         '         <strong class="ipsSteps_title">Βήμα 1</strong>' +
         '            <span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;"> ' +
         '         <strong class="ipsSteps_title">Βήμα 2</strong>' +
         '            <span class="ipsSteps_desc">Λογαριασμός</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 3</strong>' +
         '         <span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '   </ul>' +
         '</div>'
      );
   }
   // 2
   if (jQuery('#ucp div.main-head:contains("Πληροφορίες εγγραφής")').length) {
      jQuery('#ucp div.main-head:contains("Πληροφορίες εγγραφής")').before(
         '<div class="ipsSteps clearfix" style="margin-bottom: 8px;">' +
         '   <ul>' +
         '      <li>' +
         '         <strong class="ipsSteps_title">Βήμα 1</strong>' +
         '            <span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li class="ipsSteps_active" style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 2</strong>' +
         '         <span class="ipsSteps_desc">Ο λογαριασμός σας</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 3</strong>' +
         '         <span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow">&nbsp;</span>' +
         '      </li>' +
         '   </ul>' +
         '</div>'
      );
   };
   // 3
   if (jQuery('#form_confirm div.main-head:contains("Πληροφορίες εγγραφής")').length) {
      jQuery('#form_confirm div.main-head:contains("Πληροφορίες εγγραφής")').before(
         '<div class="ipsSteps clearfix" style="margin-bottom: 8px;">' +
         '   <ul>' +
         '      <li>' +
         '         <strong class="ipsSteps_title">Βήμα 1</strong>' +
         '            <span class="ipsSteps_desc">Όροι Χρήσης</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 2</strong>' +
         '         <span class="ipsSteps_desc">Ο λογαριασμός σας</span><span class="ipsSteps_arrow"></span>' +
         '      </li>' +
         '      <li class="ipsSteps_active" style="width: 83px;">' +
         '         <strong class="ipsSteps_title">Βήμα 3</strong>' +
         '         <span class="ipsSteps_desc">Επιβεβαίωση</span><span class="ipsSteps_arrow">&nbsp;</span>' +
         '      </li>' +
         '   </ul>' +
         '</div>'
      );
   };
});

Result:


So long,

JS

JScript
Forumember

Male Posts : 741
Reputation : 168
Language : PT-BR, EN
Location : Brazil

http://jscript.forumeiros.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by Roke. on April 17th 2015, 11:45 pm

What's the CSS for this?

Roke.
New Member

Posts : 17
Reputation : 1
Language : Italian, English

http://www.zanimanga.italians.tv

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by Van-Helsing on April 18th 2015, 12:02 am

Thanks @JScript Now it is solved.
@Roke. here is the CSS

Code:

.ipsSteps {
    background: #E9E9E9;
    height: 55px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    }
    .ipsSteps li:first-child {
    border-radius: 3px 0px 0px 3px;
    -moz-border-radius: 3px 0px 0px 3px;
    border-radius: 3px 0px 0px 3px;
    }
    .ipsSteps ul li {
    float: left;
    padding: 11px 33px 5px 18px;
    color: #323232;
    background-image: url('http://i69.servimg.com/u/f69/17/45/75/97/wizard10.png');
    background-repeat: no-repeat;
    background-position: 100% -56px;
    position: relative;
    height: 39px;
    text-shadow: rgba(255, 255, 255, 0.6) 0px 1px 0px;
    }
    .ipsSteps_title {
    display: block;
    font-size: 14px;
    padding-bottom: 4px;
    }
    .ipsSteps_desc {
    font-size: 11px;
    }
    .ipsSteps ul li:first-child .ipsSteps_arrow {
    display: none !important;
    }
    .ipsSteps .ipsSteps_active {
    background-position: 100% 0;
    color: white;
    text-shadow: 0px -1px 0 rgba(0, 0, 0, 0.8);
    }
    .ipsSteps_active .ipsSteps_arrow {
    display: block;
    position: absolute;
    left: -23px;
    top: 0;
    width: 23px;
    height: 55px;
    background: url('http://i69.servimg.com/u/f69/17/45/75/97/wizard10.png') no-repeat 0 -112px;
    }

Van-Helsing
Hyperactive

Male Posts : 2222
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: Problem with IPS Steps Javascript

Post by SLGray on April 18th 2015, 12:48 am

Topic solved and archived


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


SLGray
Administrator
Administrator

Male Posts : 36698
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.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