Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag02.11.2012 um 12:53 (UTC)    
Titel: Slideshow vermitteln

Hallo,
wie bekomme ich meine Slideshow in die Mitte?
Steht etwas links versetzt - also nicht in einer Linie mit den anderen Bildern.
Zentrieren nützt nix - da rutscht alles nach rechts über den Rand.

Danke für code

MfG Bernd
______________
Beitrag02.11.2012 um 12:54 (UTC)    
Titel: Re: Slideshow vermitteln

ikarus-288 hat Folgendes geschrieben:
Hallo,
wie bekomme ich meine Slideshow in die Mitte?
Steht etwas links versetzt - also nicht in einer Linie mit den anderen Bildern.
Zentrieren nützt nix - da rutscht alles nach rechts über den Rand.

Danke für code

MfG Bernd


Hi, welche Slideshow? Auf welcher Seite ist die?
Beitrag02.11.2012 um 12:56 (UTC)    
Titel:

Natürlich auf meiner - Startseite oben

MfG Bernd
______________


Zuletzt bearbeitet von ikarus-288 am 02.11.2012, 13:57, insgesamt einmal bearbeitet
Beitrag02.11.2012 um 12:58 (UTC)    
Titel:

Aso, hab die garnicht gesehen die Slider.
Versuchs mal mit <center> am Anfang von der Slider und </center> am Ende im HTML-Code
Beitrag02.11.2012 um 13:00 (UTC)    
Titel:

Hier im Text über Design - das ist mein Code ... wo soll das hin?

Code:
<style type="text/css">
body{
    font-family:arial
}
 
.clear {
    clear:both
}
 
#gallery {
    position:relative;
    height:185px
}
    #gallery a {
        float:left;
        position:absolute;
    }
     
    #gallery a img {
        border:none;
    }
     
    #gallery a.show {
        z-index:700
    }
 
    #gallery .caption {
        z-index:600;
        background-color:#000;
        color:#ffffff;
        height:100px;
        width:100%;
        position:absolute;
        bottom:0;
    }
 
    #gallery .caption .content {
        margin:5px
    }
     
    #gallery .caption .content h3 {
        margin:300;
        padding:0;
        color:#ffff00;
    }

</style>
<script src="http://omba.pf-control.de/js/jquery.js"></script>
<script type="text/javascript">

$(document).ready(function() {     
     
    //Execute the slideShow
    slideShow();
 
});
 
function slideShow() {
 
    //Set the opacity of all images to 0
    $('#gallery a').css({opacity: 0.0});
     
    //Get the first image and display it (set it to full opacity)
    $('#gallery a:first').css({opacity: 1.0});
     
    //Set the caption background to semi-transparent
    $('#gallery .caption').css({opacity: 0.7});
 
    //Resize the width of the caption according to the image width
    $('#gallery .caption').css({width: $('#gallery a').find('img').css('width')});
     
    //Get the caption of the first image from REL attribute and display it
    $('#gallery .content').html($('#gallery a:first').find('img').attr('rel'))
    .animate({opacity: 0.7}, 400);
     
    //Call the gallery function to run the slideshow, 6000 = change to next image after 6 seconds
    setInterval('gallery()',7000);
     
}
 
function gallery() {
     
    //if no IMGs have the show class, grab the first image
    var current = ($('#gallery a.show')?  $('#gallery a.show') : $('#gallery a:first'));
 
    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    var next = ((current.next().length) ? ((current.next().hasClass('caption'))? $('#gallery a:first') :current.next()) : $('#gallery a:first')); 
     
    //Get next image caption
    var caption = next.find('img').attr('rel');
     
    //Set the fade in effect for the next image, show class has higher z-index
    next.css({opacity: 0.0})
    .addClass('show')
    .animate({opacity: 1.0}, 1000);
 
    //Hide the current image
    current.animate({opacity: 0.0}, 1000)
    .removeClass('show');
     
    //Set the opacity to 0 and height to 1px
    $('#gallery .caption').animate({opacity: 0.0}, { queue:false, duration:0 }).animate({height: '1px'}, { queue:true, duration:300 });
     
    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
    $('#gallery .caption').animate({opacity: 0.7},100 ).animate({height: '100px'},500 );
     
    //Display the content
    $('#gallery .content').html(caption);
         
}

</script>
<style type="text/css">
<!--
td.edit_button_bg {
background-color: #990000;
background-image:url(http://img.webme.com/pic/i/ikarus-288/button201x29red01.png); }
td.edit_button_bg:hover {
background-color: #990000;
background-image:url(http://img.webme.com/pic/i/ikarus-288/201x29buttonms08.png); }
body {
background-image: url(http://img.webme.com/pic/i/ikarus-288/175x175hintergrund07.png);
background-repeat: repeat;
background-attachment: fixed; }
-->
</style>
<style type="text/css">
#LeererButton1{
position:relative;
left:-12%;
width:111%;
height:27px;
background-image:url(http://img.webme.com/pic/i/ikarus-288/button333.png);
background-repeat:no-repeat;
}
</style>
</style>
<style type="text/css">
#LeererButton2{
position:relative;
left:-12%;
width:111%;
height:27px;
background-image:url(http://img.webme.com/pic/i/ikarus-288/button333.png);
background-repeat:no-repeat;
}
</style>
</style>
<style type="text/css">
#LeererButton3{
position:relative;
left:-12%;
width:111%;
height:27px;
background-image:url(http://img.webme.com/pic/i/ikarus-288/button333.png);
background-repeat:no-repeat;
}
</style>
</style>
<style type="text/css">
#CVAGLOGO01{
position:relative;
left:-12%;
width:111%;
height:27px;
background-image:url(http://img.webme.com/pic/i/ikarus-288/button444cvag.png);
background-repeat:no-repeat;
}
</style>
[/quote]
______________
Beitrag02.11.2012 um 13:05 (UTC)    
Titel:

Geh auf Seiten bearbeiten klicke dann auf die Startseite und ganz oben links auf Quellcode.

Dann siehst du dort:

Code:
<div id="gallery">
<div style="text-align: left;"><a target="_blank" href="http://ikarus-288.de.tl/Stadtbusse.htm" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/willkommen01.png" alt="Flowing Rock" rel="&lt;h3&gt;IKARUS - 288.de&lt;/h3&gt;Busse und Bahnen aus Deutschland und anderen L&auml;ndern" /></a>   <a href="http://www.ikarus-288.de/"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/ikarus-288de.png" alt="Grass Blades" rel="&lt;h3&gt;IKARUS - 288.de&lt;/h3&gt;Reiseberichte aus Europa" /> </a>  <a target="_blank" href="http://ikarus-288.de.tl/Lenk_-und-Ruhezeiten.htm"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/willkommen02.png" alt="Grass Blades" rel="&lt;h3&gt;IKARUS - 288.de&lt;/h3&gt;Hinweise zu Lenk- und Ruhezeiten" /> </a>  <a target="_blank" href="http://phototrans.de/" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/phototransde.png" alt="Flowing Rock" rel="&lt;h3&gt;www.phototrans.de&lt;/h3&gt;Hervorragende Datenbank zu Bussen und Bahnen" /></a>   <a target="_blank" href="http://www.busforum.org/" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/busforumorg.png" alt="Flowing Rock" rel="&lt;h3&gt;www.busforum.org&lt;/h3&gt;Gro&szlig;er Berlin-Teil - Alles rund um den &Ouml;PNV" /></a>   <a target="_blank" href="http://www.homepage-baukasten.de/" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/hpbkde.png" alt="Flowing Rock" rel="&lt;h3&gt;www.homepage-baukasten.de&lt;/h3&gt;Erstelle deine eigene HP" /></a>   <a target="_blank" href="http://www.busfahrertreff.eu/forum1/index.php" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/busfahrertreffde.png" alt="Flowing Rock" rel="&lt;h3&gt;www.busfahrertreff.de&lt;/h3&gt;Informationen und Forum f&uuml;r Busfahrer/innen" /></a></div>
<div class="caption">
</div>

Ersetzt das durch:

Code:
<center><div id="gallery">
<div style="text-align: left;"><a target="_blank" href="http://ikarus-288.de.tl/Stadtbusse.htm" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/willkommen01.png" alt="Flowing Rock" rel="&lt;h3&gt;IKARUS - 288.de&lt;/h3&gt;Busse und Bahnen aus Deutschland und anderen L&auml;ndern" /></a>   <a href="http://www.ikarus-288.de/"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/ikarus-288de.png" alt="Grass Blades" rel="&lt;h3&gt;IKARUS - 288.de&lt;/h3&gt;Reiseberichte aus Europa" /> </a>  <a target="_blank" href="http://ikarus-288.de.tl/Lenk_-und-Ruhezeiten.htm"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/willkommen02.png" alt="Grass Blades" rel="&lt;h3&gt;IKARUS - 288.de&lt;/h3&gt;Hinweise zu Lenk- und Ruhezeiten" /> </a>  <a target="_blank" href="http://phototrans.de/" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/phototransde.png" alt="Flowing Rock" rel="&lt;h3&gt;www.phototrans.de&lt;/h3&gt;Hervorragende Datenbank zu Bussen und Bahnen" /></a>   <a target="_blank" href="http://www.busforum.org/" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/busforumorg.png" alt="Flowing Rock" rel="&lt;h3&gt;www.busforum.org&lt;/h3&gt;Gro&szlig;er Berlin-Teil - Alles rund um den &Ouml;PNV" /></a>   <a target="_blank" href="http://www.homepage-baukasten.de/" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/hpbkde.png" alt="Flowing Rock" rel="&lt;h3&gt;www.homepage-baukasten.de&lt;/h3&gt;Erstelle deine eigene HP" /></a>   <a target="_blank" href="http://www.busfahrertreff.eu/forum1/index.php" class="show"> <img width="440" height="79" src="http://img.webme.com/pic/i/ikarus-288/busfahrertreffde.png" alt="Flowing Rock" rel="&lt;h3&gt;www.busfahrertreff.de&lt;/h3&gt;Informationen und Forum f&uuml;r Busfahrer/innen" /></a></div>
<div class="caption">
</div></center>


Zuletzt bearbeitet von farmtime am 02.11.2012, 14:18, insgesamt 4-mal bearbeitet
Beitrag02.11.2012 um 13:11 (UTC)    
Titel:

Habs gerade editiert. Musstest <center bei Content machen ersetzt einfach das was oben steht jetzt müsste es eigentlich gehen.


Zuletzt bearbeitet von farmtime am 02.11.2012, 14:15, insgesamt einmal bearbeitet
Beitrag02.11.2012 um 13:15 (UTC)    
Titel:

Jetzt ist meine Startseite zerschossen ?
______________
Beitrag02.11.2012 um 13:17 (UTC)    
Titel:

</center> nicht hinter CONTENT sondern bei CAPTION.

Nach CAPTION </center> machen und das andere wegmachen.
Beitrag02.11.2012 um 13:18 (UTC)    
Titel:

So wie es im unteren Code jetzt auch steht.
Beitrag02.11.2012 um 13:19 (UTC)    
Titel:

Moment ... ich bin 58 Mr. Green
Das dauert etwas
______________
Beitrag02.11.2012 um 13:20 (UTC)    
Titel:

Very Happy
Beitrag02.11.2012 um 13:27 (UTC)    
Titel:

Nö, die Bilder rutschen nach rechts

Habe zum Glück den Originalcode - den hab ich nun schon zum dritten mal wieder eingefügt.
Tatsache ist es funzt net - oder ich mach was falsch
Question
______________
Beitrag02.11.2012 um 13:30 (UTC)    
Titel:

Moment ich schua mal wie dus gemacht hast
Beitrag02.11.2012 um 13:31 (UTC)    
Titel:

Wie meinst du es rutscht nach rechts?
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de