Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

jQuery Banner Rotator


kymation

Recommended Posts

Probably the best explanation is on the jquery API page.

 

Regards

Jim

 

Thanks for the swift reply. I checked out the page, thanks,

and understand the concept, it's that danged execution

that's bedeviling me. Did get it to work on another page (very impressive!)

so it seems like the place to concentrate is index.php

(I was kinda bouncing in and out of modules/ and functions/ too

trying to "crack the combination" or "get lucky")

Well, I'll follow up when I stumble on the solution,

it's definitely worth the effort,

 

Thanks again,

jk

Link to comment
Share on other sites

follow-up:

 

status: resolved

 

solution: added rotator to header.php and removed conflicting mootools slideshow

 

benefit: yours is superior having (cept for thumbnails) all mootools functionality plus click feature

 

quite a spectacular enhancement

Thanks,

 

jk

Link to comment
Share on other sites

follow-up:

 

status: resolved

 

solution: added rotator to header.php and removed conflicting mootools slideshow

 

benefit: yours is superior having (cept for thumbnails) all mootools functionality plus click feature

 

quite a spectacular enhancement

Thanks,

 

jk

 

well, it was lookin good til i tried internet explorer

now get this: object doesn't support this property or method prototype.js

 

the code executes, however,

when the banner changes, the page height expands downward (doubles)

basically "dribbles" whatever is underneath (the rest of the page)

 

i reckon by putting it in the header,

it isn't getting some code that appears maybe in index.php?

 

any insight?

 

jk

Link to comment
Share on other sites

  • 2 weeks later...

To make the banner rotator work on other pages, you will need to add the Javascript code to the head of every page that you want it to work in. See catalog/index.php, lines 43-51 in the banner rotator distribution.

 

Regards

Jim

 

Hi Jim,

 

I really commend this mod. except for inability to control the navs but more that you have to put the Javascript code into the head of every page you want it to work in. You know there are several tens of hundreds of pages. It's really not an easy task lol!

 

I was wondering if you found a way around this yet?

Link to comment
Share on other sites

  • 1 month later...

Hello.

 

Please , anyone who managed to make it work with STS , share your findings.

I would love to use this contribution , but no matter what I tried to do - the banner did not show up on the home page.

 

Thank you

Link to comment
Share on other sites

...

1.How to remove the play-stop button over the images??? (I want to remove the button, only images)

 

...

Regards.

Great contribution, I just want to use it/apply it differently.

 

Like bh,I want to do the same. I want to give the front page a fresh feel-- a new random shot each visit. Currently one image comes up and it is working great...but the button is useless as I don't want people to get frustrated hitting play and not seeing anything happen because I set it to show only one image. I tried "0," but then the image didn't show at all. I tried to comment out the nav in ext/modules/banner_rotator.css /*but it didn't work*/.

 

I considered making all the play, pause, and circle icons transparent, but thought it would better to do it another way, but don't know how.

 

I'd also like to round the banner edges if possible. I can do this manually image-by-image, but figured there is some css that would take care of it, again I don't know how, though I fiddled with lots of code trying to get it to work.

Edited by ErikMM

Web Developer, Firebug, and Notepad++ are powerful free tools for web design.

Link to comment
Share on other sites

You're doing this the hard way. Just copy the banner code from the footer and use that:

<?php
 if ($banner = tep_banner_exists('dynamic', 'something')) {
?>

<div class="grid_24" style="text-align: center;">
 <?php echo tep_display_banner('static', $banner); ?>
</div>

<?php
 }
?>

Change the something to whatever you named your banner group.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

Hi Jim, first great add on you're saving lives!

Not sure if you can help me on this, but I need ask you - I installed your add on and it's working perfectly... However I have a CSS menu which expands subcategories to right when mouse is on... exactly where I placed the banner rotator (you can see the menu example at www.artigosdcorart.com.br)

Problem is banner rotator overrides the expanded categories, my question: is there any way to set banner to the back or leave it transparently (as we do for shockwave flash - tags <object>)? Thanks much!

-----------------------------------------------------------------------------------------------------------------

Jim, pls disregad this - problem solved Thanks!

Edited by p5master
Link to comment
Share on other sites

Try adding a z-index to the CSS container for your menu. If that's not enough, add it to the container for the banner rotator as well. Make the menu's z-index higher of course.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

You're doing this the hard way. Just copy the banner code from the footer and use that:

<?php
 if ($banner = tep_banner_exists('dynamic', 'something')) {
?>

<div class="grid_24" style="text-align: center;">
 <?php echo tep_display_banner('static', $banner); ?>
</div>

<?php
 }
?>

Change the something to whatever you named your banner group.

 

Regards

Jim

awesome...now I suppose I can use the rotator for what it was intended for. Thanks!

Web Developer, Firebug, and Notepad++ are powerful free tools for web design.

Link to comment
Share on other sites

I spoke too soon. I changed the code, but the rotator still showed after the change. In turn, I turned off the rotator in admin/front page, but the result was that nothing showed at all, not even the regular non-rotator banner...thought the 'normal' one would show after the change, but it didn't.

Edited by ErikMM

Web Developer, Firebug, and Notepad++ are powerful free tools for web design.

Link to comment
Share on other sites

The code that I posted above is not a module. If you want it to be a front-page module you will have to convert it. If you just want it to be on the top of the front page, just under the header, then paste it into catalog/index.php just above the module code.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

  • 1 month later...

This thing is exactually what I was looking for!

 

QUESTION:

 

1. how to I get the banner displayed to be centered on the page? It aligns left by default and it aligns to the right if I add <td align="center"> in front of the code

 

2. If I have a banner thats 650x250 if cuts off the right corner unless I make it larger like 700x250.

 

Besides those two issues im having this thing rocks!

Edited by mrossi
Link to comment
Share on other sites

It will work just fine with 2.3.1. That version already has the Jquery files loaded, so don't add them again. You can also use the version of this that's included in the Modular Front Page addon, since that's an easier install.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

Sorry, didn't see that.

1. The Javascript is designed to align to the left. You might be able to change that. You might also be able to put the Rotator in a div with another div th the left, and use the 960 grid to set the div widths to move the one containing the banner to the center. I haven't tried this, so some experimentation is in order.

2. I don't understand the question. Banners need to be 620 pixels wide to fit the center of a stock 2.3.1 install. If you've changed the page layout in a way that changes the width of the center column, you need to make your banners the width of that column or less. Don't forget the gutter width when calculating the width of the column. You also need to change the width settings in catalog/ext/modules/banner_rotator/stylesheet.css to match your banner width.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

thanks for your reply kymation. I have recently installed version 2.3.1 and have been playing around to see the differences and if it would be easier to move from the rc2a version. In regards to the banner, all i did was add extra banners to the group 468x50 but the banners were not changing unless i pressed the refresh key, is there anything additional that needs to be done? or do i just install the modular frontpage addon?

 

Thanks once again for your help.

Link to comment
Share on other sites

I would change to a different group. That one is used elsewhere in the code.

 

The Modular Front Page Addon is much easier to install in 2.3.1. At least you get rid of some of the possible installation errors with the older version.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

thanks kymation for responding!

 

I spent all day trying to make this thing center with no avail.

 

My site is using 100% of the screen and the banner aligns to the left by default. I have modified the CSS, banner_rotator.php, and a few other things I cant remember.

 

For some reason everytime I get the thing to center then the banner only shows the right corner.

 

Im lost, I cant be the first person to want this thing centered but I get lost in CSS.

 

-matt

Link to comment
Share on other sites

After 4 days of work got the banner to center on my 100% width site. For anyone needing this same thing do the following

 

on index.php go to the <TD> that contains the rotator module execution and add align="center"

then go to

includes/modules/banner_rotator.php and find <div id="bannerRotator"> and add align="left"

 

All is well and this module rocks!

 

PS: anyone know how to shrink the size of the navigation bar height? I noticed beacon9.ca navigation is much smaller and looks a bit better.

Edited by mrossi
Link to comment
Share on other sites

The navigation bar is a set of images. Look in the images/icons/ folder for the images used. You can resize those, modify them, or create your own. If you change the dimensions, don't forget to change the dimensions in the stylesheet.css if appropriate.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites

  • 2 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...