iweb - auto fading Text geht nicht

I

iFrage

Registriert
Thread Starter
Dabei seit
09.06.2011
Beiträge
1
Reaktionspunkte
0
Hallo MacUser,

vorab freut mich hier zu sein, in der apple Welt^^

Bin zwar schon vor 5 Monaten auf Apple umgestiegen, aber ich muss sagen, ich fühl mich wie am ersten Tag, einfach geil der Mac!!:D

SO, nun aber zum Problem

ich bin grade dabei, für eine Seite, eine besondere Startseite zu programmieren, wäre auch schon fertig, aber bei dem auto fading text habe ich noch Probleme, da er nicht zu gehen scheint, oder ich doch irgendwo einen Fehler eingebaut habe, vielleicht könntet ihr euch das mal ansehen :eek:

Code für auto fading text:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<style type="text/css" media="screen">
p#textbox {
width: 100%;
height: 50px;
line-height: 100%;
font-family:"Lucida Grande", "Lucida Sans Unicode", sans-serif;
font-size: 12px;
color:#blue;
text-align: right;
padding: 0;
margin: 0;
}

#textbox a:link {
color:#red;
text-decoration:none;

}
#textbox a:visited {
color:#yellow;
text-decoration:bold;
}

</style>

<script type="text/javascript">

// You need to define these variants.
/* begin to modify */
var contents = [ // If you choose "Text" type, you can input any text lines
{title:"Hello! This is the first news", url:"page.html"},
{title:"Hello! This is the second news", url:"page.html"},
{title:"Hello! This is the third news", url:"page.html"}
];
var version = 1; // 0: Manipulating Opacity (Default), 1: Using JQUERY FadeIn (JQUERY)
var type = "XML"; // 3 types: TEXT, RSS, XML | Default is TEXT loading contents from the contents array
var rssfeedURL = "/iweb/blogs/rss.xml"; // Your iWeb RSS feed URL
var newsURL = "news.xml"; // Your News XML file URL
var fadetime = 3000; // Fading duration
var pausetime = 2000; // Pausing duration after fade in
/* end line */

// You don't need to modify codes below
var count = 0;
var opacity = 0.00;
var t;
var textbox, link;

function getRSSfeeds(xml)
{
while (contents.length) {
contents.pop();
}

var $items = jQuery('item', xml);

$items.each(function(i) {
var container = jQuery('description', this).text();
var description = truncate(container.slice(container.indexOf('</a>') + 4), 100);
contents.push({title: description, url: jQuery('link', this).text()});
});
}

function getItems(xml)
{
while (contents.length) {
contents.pop();
}

var $items = jQuery('item', xml);

$items.each(function(i) {
contents.push({title: jQuery(this).attr("title"), url: jQuery(this).attr("url")});
});
}

function truncate(str, length, suffix) {
if (str.length <= length) {
return str;
}

if (suffix == undefined) {
suffix = '...';
}

return str.substr(0, length).replace(/\s+?(\S+)?$/g, '') + suffix;
};

function fadetext()
{
version == 1 ? fadetextjquery() : fadetextopacity();
}

function fadetextopacity()
{
if (t)
clearTimeout(t);

opacity = 0.00;
textbox.style.opacity = opacity;
textbox.style.filter = "alpha(opacity=" + (opacity * 100) + ")";

link.innerHTML=contents[count].title;

if (contents[count].url)
link.href=contents[count].url;
else
link.removeAttribute('href');

changeopacity();

count++;

if (count == contents.length)
count = 0;

setTimeout("fadetextopacity()", fadetime + pausetime);
}

function fadetextjquery()
{
textbox.fadeOut(function(){
link.html(contents[count].title);

if (contents[count].url)
link.attr("href", contents[count].url);
else
link.removeAttr("href");

textbox.fadeIn(fadetime, function(){
count++;
if (count == contents.length)
count = 0;

setTimeout("fadetextjquery()", pausetime);
});
});
}

function changeopacity()
{
if (opacity < 1.00)
{
opacity = opacity + 0.01;

textbox.style.opacity = opacity;
textbox.style.filter = "alpha(opacity=" + (opacity * 100) + ")";

t = setTimeout("changeopacity()", fadetime / 100);
}
}

jQuery(document).ready(function() {

if (version) { //jQuery
textbox = jQuery('#textbox');
link = jQuery('#link');
} else { // CSS
textbox = document.getElementById("textbox");
link = document.getElementById("link");
}

switch (type)
{
case "RSS":
jQuery.get(rssfeedURL, {}, function(xml) {
getRSSfeeds(xml);
fadetext();
}, "xml");
break;

case "XML":
jQuery.get(newsURL, {}, function(xml) {
getItems(xml);
fadetext();
}, "xml");
break;

default:
fadetext();
break;
}
});
</script>

</head>
<body style="background-color: transparent; margin: 0pt;">
<p id="textbox"><a id="link" target="_top"></a></p>
</body>
</html>

nun ja, das in das html widget eingesetzt, erscheint höchstens die Textzeile alles andere fehlt
 
aber bei dem auto fading text habe ich noch Probleme, da er nicht zu gehen scheint
Zum Vergrößern anklicken....

Ungenaue Aussage. Womit geht das nicht ?. Hast Du das mit einem browser ( Safari ) angeschaut ?. Oder Firefox ?.

Woher hast Du den Code ?. Irgendwo aus dem Netz ?. Darauf geachtet ob es Angaben gab, mit welchen Browsern der Code funktioniert ?.

Nicht alle Codes funktionieren mit allen Browsern.

Also Du solltest zuerst den Code mit versch. Browsern testen. Wenn er nicht mit allen Browsern funktioniert, such Dir einen anderen Code. Es gibt genug im Netz.

Ich glaube nicht, das sich jemand die Arbeit macht und für Dich den Code durcharbeitet.

Ausserdem solltest Du Deine Fragen genauer formulieren bzw. mehr Angaben machen, sonst fällt es schwer zu helfen.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben Unten