TP-Docs
HTML5 Icon HTML5 Icon HTML5 Icon
TP on Social Media

Recent

Welcome to TinyPortal. Please login or sign up.

March 29, 2024, 05:44:47 AM

Login with username, password and session length
Members
Stats
  • Total Posts: 195,105
  • Total Topics: 21,213
  • Online today: 358
  • Online ever: 3,540 (September 03, 2022, 01:38:54 AM)
Users Online
  • Users: 1
  • Guests: 335
  • Total: 336
  • @rjen

Image Slider With Links?

Started by NeoMorph, March 25, 2010, 11:46:45 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Xarcell

You have to have the UL tags and the LI tags. Just make sure th CSS is right for the tags. What slider are you trying to use?

NeoMorph

After banging my head on my keyboard I have finally got the slider to work and display perfectly in all the main browsers including IE8 compatibility and native modes.

It was thanks to your links Xarcell that I was able to find one that worked...

This is the one I finally went with...

http://www.queness.com/resources/archives/jquery-newsslider.zip


SN

Quote from: NeoMorph on April 02, 2010, 09:45:01 AM
After banging my head on my keyboard I have finally got the slider to work and display perfectly in all the main browsers including IE8 compatibility and native modes.

It was thanks to your links Xarcell that I was able to find one that worked...

This is the one I finally went with...

http://www.queness.com/resources/archives/jquery-newsslider.zip



Glad to hear it!

you should post how you did it, it can help others if they want a similar feature.

othg_weasel

I have been using this php code image scroller with links on my site and its worked fine for older versions of TP as well as TP1.0b5

When I upgraded to TP1.0.b5-1 this morning I got an error  ??? Can this code be mortified to work with TP1.0b5-1? or should I look for an alternative?

echo '<style type="text/css"><!--

#stormscontainer«
position: relative;
width: 140px; /*marquee width */
height: 280px; /*marquee height */
overflow: hidden;
border: 0px solid #CF2E2E;
padding: 0px;
margin: 0px;
text-align: left;
»
--></style>';

echo "
<script type=\"text/javascript\">

/***********************************************
* Cross browser Marquee II- ? Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var delaybbeforescroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var stormsspeed=1 //Specify storms scroll speed (larger is faster 1-10)
var pits=1 //Pause storms onMousever (0=no. 1=yes)?

////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=stormsspeed
var pausespeed=(pits==0)? copyspeed: 0
var actualheight=''

function scrollstorms()Ã,«
if (parseInt(cross_storms.style.top)>(actualheight*(-1)+8))
cross_storms.style.top=parseInt(cross_storms.style.top)-copyspeed+\"px\"
else
cross_storms.style.top=parseInt(stormsheight)+8+\"px\"
Ã,»

function initializestorms()Ã,«
cross_storms=document.getElementById(\"vstorms\")
cross_storms.style.top=0
stormsheight=document.getElementById(\"stormscontainer\").offsetHeight
actualheight=cross_storms.offsetHeight
if (window.opera || navigator.userAgent.indexOf(\"Netscape/7\")!=-1)Ã,« //if Opera or Netscape 7x, add scrollbars to scroll and exit
cross_storms.style.height=stormsheight+\"px\"
cross_storms.style.overflow=\"scroll\"
return
Ã,»
setTimeout('lefttime=setInterval(\"scrollstorms()\",30)', delaybbeforescroll)
Ã,»

if (window.addEventListener)
window.addEventListener(\"load\", initializestorms, false)
else if (window.attachEvent)
window.attachEvent(\"onload\", initializestorms)
else if (document.getElementById)
window.onload=initializestorms


</script>";

echo '<div align="center">
<div id="stormscontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=stormsspeed">
<div id="vstorms"  style="position: absolute; width: 98%;">

<!--YOUR SCROLL CONTENT HERE-->



</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/fox.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/dunlop.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/amsoil.jpg" alt="Davids Laser" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/hazardous.jpg" alt="Davids Laser" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/racetech.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/shoel.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/spyoptic.jpg" alt="" border="0px" width="105px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/surdyke.jpg" alt="" border="0px" width="97px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/taper.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/thor.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/twin_air.jpg" alt="" border="0px" width="125px" />

<!--YOUR SCROLL CONTENT HERE-->

</div>
</div></div>';

Blue Steel

you need to do a search and replace on
Ã,«
Ã,»

and replace with
{
}
respectivly

othg_weasel

Quote from: BlueSteel on April 12, 2010, 02:52:40 PM
you need to do a search and replace on
Ã,«
Ã,»


and replace with
{
}
respectivly


I am not a coder by any means but I am trying to learn and get a better understanding of how this works.

I tried to replace all Ã,« Ã,» with {} and I don't get the error any more But It does not show the images?

Blue Steel

please try reposting your code here in case you've made a mistake or something..

othg_weasel

Quote from: BlueSteel on April 12, 2010, 03:54:16 PM
please try reposting your code here in case you've made a mistake or something..

Ok sorry. echo '<style type="text/css"><!--

#stormscontainer«
position: relative;
width: 140px; /*marquee width */
height: 280px; /*marquee height */
overflow: hidden;
border: 0px solid #CF2E2E;
padding: 0px;
margin: 0px;
text-align: left;
»   
--></style>';

echo "
<script type=\"text/javascript\">

/***********************************************
* Cross browser Marquee II- ? Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var delaybbeforescroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var stormsspeed=1 //Specify storms scroll speed (larger is faster 1-10)
var pits=1 //Pause storms onMousever (0=no. 1=yes)?

////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=stormsspeed
var pausespeed=(pits==0)? copyspeed: 0
var actualheight=''

function scrollstorms(){
if (parseInt(cross_storms.style.top)>(actualheight*(-1)+8))
cross_storms.style.top=parseInt(cross_storms.style.top)-copyspeed+\"px\"
else
cross_storms.style.top=parseInt(stormsheight)+8+\"px\"
}

function initializestorms(){
cross_storms=document.getElementById(\"vstorms\")
cross_storms.style.top=0
stormsheight=document.getElementById(\"stormscontainer\").offsetHeight
actualheight=cross_storms.offsetHeight
if (window.opera || navigator.userAgent.indexOf(\"Netscape/7\")!=-1)Ã,« //if Opera or Netscape 7x, add scrollbars to scroll and exit
cross_storms.style.height=stormsheight+\"px\"
cross_storms.style.overflow=\"scroll\"
return
}
setTimeout('lefttime=setInterval(\"scrollstorms()\",30)', delaybbeforescroll)
}

if (window.addEventListener)
window.addEventListener(\"load\", initializestorms, false)
else if (window.attachEvent)
window.attachEvent(\"onload\", initializestorms)
else if (document.getElementById)
window.onload=initializestorms


</script>";

echo '<div align="center">
<div id="stormscontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=stormsspeed">
<div id="vstorms"  style="position: absolute; width: 98%;">

<!--YOUR SCROLL CONTENT HERE-->



</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/fox.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/dunlop.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/amsoil.jpg" alt="Davids Laser" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/hazardous.jpg" alt="Davids Laser" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/racetech.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/shoel.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/spyoptic.jpg" alt="" border="0px" width="105px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/surdyke.jpg" alt="" border="0px" width="97px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/taper.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/thor.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/twin_air.jpg" alt="" border="0px" width="125px" />

<!--YOUR SCROLL CONTENT HERE-->

</div>
</div></div>';

Blue Steel

youve missed one on line 47


if (window.opera || navigator.userAgent.indexOf(\"Netscape/7\")!=-1)Ã,« //if Opera or Netscape 7x, add scrollbars to scroll and exit

othg_weasel

Quote from: BlueSteel on April 12, 2010, 04:11:18 PM
youve missed one on line 47


if (window.opera || navigator.userAgent.indexOf(\"Netscape/7\")!=-1)Ã,« //if Opera or Netscape 7x, add scrollbars to scroll and exit


Again sorry I had two many windows up. I'm slowing down and promise Ill check and recheck before I post again.

ok I know I didn't miss anything this time and still no scrolling pics..?

Thank you so much for your patients I know you prob have more important things to do. But I really appreciate you.

echo '<style type="text/css"><!--

#stormscontainer«
position: relative;
width: 140px; /*marquee width */
height: 280px; /*marquee height */
overflow: hidden;
border: 0px solid #CF2E2E;
padding: 0px;
margin: 0px;
text-align: left;
»   
--></style>';

echo "
<script type=\"text/javascript\">

/***********************************************
* Cross browser Marquee II- ? Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var delaybbeforescroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var stormsspeed=1 //Specify storms scroll speed (larger is faster 1-10)
var pits=1 //Pause storms onMousever (0=no. 1=yes)?

////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=stormsspeed
var pausespeed=(pits==0)? copyspeed: 0
var actualheight=''

function scrollstorms(){
if (parseInt(cross_storms.style.top)>(actualheight*(-1)+8))
cross_storms.style.top=parseInt(cross_storms.style.top)-copyspeed+\"px\"
else
cross_storms.style.top=parseInt(stormsheight)+8+\"px\"
}

function initializestorms(){
cross_storms=document.getElementById(\"vstorms\")
cross_storms.style.top=0
stormsheight=document.getElementById(\"stormscontainer\").offsetHeight
actualheight=cross_storms.offsetHeight
if (window.opera || navigator.userAgent.indexOf(\"Netscape/7\")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit
cross_storms.style.height=stormsheight+\"px\"
cross_storms.style.overflow=\"scroll\"
return
}
setTimeout('lefttime=setInterval(\"scrollstorms()\",30)', delaybbeforescroll)
}

if (window.addEventListener)
window.addEventListener(\"load\", initializestorms, false)
else if (window.attachEvent)
window.attachEvent(\"onload\", initializestorms)
else if (document.getElementById)
window.onload=initializestorms


</script>";

echo '<div align="center">
<div id="stormscontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=stormsspeed">
<div id="vstorms"  style="position: absolute; width: 98%;">

<!--YOUR SCROLL CONTENT HERE-->



</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/fox.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/dunlop.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/amsoil.jpg" alt="Davids Laser" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/hazardous.jpg" alt="Davids Laser" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/racetech.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/shoel.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/spyoptic.jpg" alt="" border="0px" width="105px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/surdyke.jpg" alt="" border="0px" width="97px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/taper.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/thor.jpg" alt="" border="0px" width="125px" />

</a></p><p align="center"><a href="" target="_self">
<img src="/sponsors/twin_air.jpg" alt="" border="0px" width="125px" />

<!--YOUR SCROLL CONTENT HERE-->

</div>
</div></div>';