Joomla Templates Club 406,261 posts

[guru2085 Friend guru2085Join date: March 2008Posts: 50Downloads:0Uploads:1 Thanks: 9]

#126621

is it possible to add rokflow from rocketthemes to this template. am working on a party website and would like to know if its possible to add the rokflow effect to the template for my flywers. am also adding the mootools script in the js folder to try to attempt to do it, if anyone can assist please your aissistant is greately appreciated

[Menalto Friend MenaltoJoin date: May 2007Posts: 4736Downloads:0Uploads:43 Thanks: 2 Thanked: 531 times in 361 posts]

#242283

Are you able to show me the rockflow? Its a while since i did it so if you can give me some correct things to look for its good.

[guru2085 Friend guru2085Join date: March 2008Posts: 50Downloads:0Uploads:1 Thanks: 9]

#242286

<em>@Menalto 44574 wrote:</em><blockquote>Are you able to show me the rockflow? Its a while since i did it so if you can give me some correct things to look for its good.</blockquote>

am still working on it as we speak, just give me some time i had to get the rokflow.js script from one of my rockettheme templates

[guru2085 Friend guru2085Join date: March 2008Posts: 50Downloads:0Uploads:1 Thanks: 9]

#242287

Step 1…
———–
-download rokflow.js from rockettheme or get it from one of your rockettheme template if you have one. click here to download rokflow.js .

-add loader.gif from rocketheme images folder to Joomlart template images folder
-click here to get loader.gif

-add the rokflow.js to your scripts directory | <script language=”javascript” type=”text/javascript” src=”<?php echo $ja_template_path;?>/scripts/rokflow.js”></script>

-heres also RokZoom click here to get it..
-create a new module and add it in the user1 position. name it whatever you want. and add the this script in the module..

<script src=”templates/ja_quillaja/scripts/rokflow.js” type=”text/javascript” charset=”utf-8″>
</script>
<script type=”text/javascript” charset=”utf-8″>
window.addEvent(‘load’, function() {
new RokFlow(‘rokflow’);
});
</script>
<div id=”rokflow”>
<div id=”loader”></div>
<div>
<a href=”images/covers/1_large.jpg” title=”Pink Floyd”>
<img src=”images/covers/1.png” title=”Pink Floyd” alt=”Pink Floyd” />
</a>
<a href=”images/covers/2_large.jpg” title=”Bon Jovi”>
<img src=”images/covers/2.png” title=”Bon Jovi” alt=”Bon Jovi” />
</a>
</div>
</div>

-you can add whatever pics u wants.
-note: resize your pics to about 124 x 94 px for the smaller pics when u clik it the size of the large pic should be about 345 x 400 px

click here to download rokzoom files to add to your scripts folder

-add this line also to your template index.php
<script type=”text/javascript”>
<?php if($enable_rokzoom==”true”) :?>
<script language=”javascript” type=”text/javascript” src=”<?php echo $ja_template_path;?>/rokzoom/rokzoom.js”></script>
<script type=”text/javascript”>
window.addEvent(‘load’, function() {
RokZoom.init({
imageDir: ‘templates/<?php echo $ja_template_path;?>/rokzoom/images/’,
resizeFX: {
duration: 700,
transition: Fx.Transitions.Cubic.easeOut,
wait: true
},
opacityFX: {
duration: 500,
wait: false
}
});
});
</script>
<?php endif; ?>

-add this line to your template.css
/* @group RokFlow */

#rokflow, #rokflow #loader {

overflow: hidden;

position: relative;

width: 800px;

height: 170px;

background: 50% 50% no-repeat url(../images/loader.gif);

}

#rokflow, #rokflow * {

margin:0; padding:0; border:0;

}

#rokflow div {

float: left;

position: relative;

}

#rokflow img {

width: 124px;

height: 194px;

border: 0;

top: 40px;

margin-top: 15px;

}

#rokflow div h3 {

display: block;

position: absolute;

white-space: nowrap;

text-align: center;

font-size: 10px;

font-weight: normal;

}

.moduletable #rokflow h3 {

background: none;

margin: 0;

padding: 0;

line-height: 100%;

height: auto;

}

#rokflow a {

text-decoration: none;

}

#rokflow #loader {

position: absolute;

top: 0; left: 0;

z-index: 1000;

}

/* @end */
—-NOTE::::

this is where am stuck at now, everything is setup correctly but it its not flowing how it should am gonna take a look at my code again line by line to make sure but here is what i have so far take a look http://www.xtrahype.com/main

[Author]

Posts