Suche Bilder-Gallerie.

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • Werbung zur Unterstützung des Forums ( Bitte AddBlocker deaktivieren )

    • Dann stell die Fragen bitte nächstes Mal deutlicher.
      Such dir einfach eins aus. Meistens gibt es dann da Beispiele, aus welchen du den nötigen Quelltext extrahieren kannst.
      Beispiel: Moving Boxes
      Quellcode:

      HTML-Quellcode

      1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> <title>Moving Boxes</title> <link rel="stylesheet" href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/css/style.css"]css/style.css[/URL]" type="text/css" media="screen" charset="utf-8"> [COLOR=Yellow]<script src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/js/jquery-1.3.1.min.js"]js/jquery-1.3.1.min.js[/URL]" type="text/javascript" charset="utf-8"></script> <script src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/js/slider.js"]js/slider.js[/URL]" type="text/javascript" charset="utf-8"></script>[/COLOR] </head> <body> <style type="text/css"> .bsa_it_ad { border: 0 !important; padding: 6px !important; overflow: hidden !important; background: #eae3c0 !important; -moz-box-shadow: 0 0 48px black; -webkit-box-shadow: 0 0 48px black; } .bsa_it_ad a { margin: 0 !important; padding: 0 !important; } .bsa_it_ad a img { border: 0 !important; position: static !important; } .bsa_it_ad a:hover img { margin: 0 !important; } .bsa_it_ad a:hover { background: none !important; } .bsa_it_i { margin: 0 15px 0 0 !important; } .bsa_it_t { margin: 12px 0 0 0 !important; font: 16px Georgia, Serif !important; } .bsa_it_d { font: 11px Verdana, Helvetica, Arial, Sans-Serif; padding-right: 10px; } .bsa_it_p { bottom: 5px !important; right: 5px !important; padding: 0 !important; } .bsa_it_p a:hover { background: none !important; } .header-button { border-top: 1px solid #cf942d !important; border-bottom: 0 !important; background: #964418 !important; background: -webkit-gradient(linear, left top, left bottom, from(#e86e36), to(#964418)) !important; background: -moz-linear-gradient(top, #e86e36, #964418) !important; padding: 3px 10px !important; -webkit-border-radius: 8px !important; -moz-border-radius: 8px !important; border-radius: 8px !important; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0 !important; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0 !important; box-shadow: rgba(0,0,0,1) 0 1px 0 !important; text-shadow: rgba(0,0,0,.4) 0 1px 0 !important; color: white !important; font-size: 13px !important; font-family: Georgia, serif !important; text-decoration: none !important; vertical-align: middle !important; display: inline !important; margin: 0 !important; float: none !important; } .header-button:hover { border-top: 1px solid #4f220d !important; background: #4f220d !important; color: #ccc !important; text-decoration: none !important; margin: 0 !important; } .header-button:active { border-top: 1px solid #261105 !important; background: #261105; } .header-button:visited:before, .header-button:visited:after { content: "" !important; } </style> <div id="hook-just-in-case" style="height: 77px; background: black url(/examples/images/examples-header-bg.png) repeat-x; color: white !important; font: 14px Georgia, Serif !important; position: relative; zoom: 1; width: 100% !important; z-index: 10000 !important;"> <div style="width: 960px; height: 77px; margin: 0 auto; position: relative;"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/images/example-logo.png"]/examples/images/example-logo.png[/URL]" alt="Demo Page" style="position: absolute; top: 0; left: 0;" /> <div style="position: absolute; left: 140px; top: 52px; width: 400px; text-align: left;"> <a class="header-button" href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/"]http://css-tricks.com[/URL]">&larr; Back Home</a> &nbsp; <a class="header-button" href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/downloads/"]http://css-tricks.com/downloads/[/URL]">Other Demos &rarr;</a> </div> <div style="width: 420px; position: absolute; right: 0; top: 0;"> <div id="bsap_1248303" class="bsarocks bsap_3469a2a501a9e18091036aa0c89f9dcb"></div> </div> </div> </div> <div id="wrapper"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/movingboxes.png"]http://www.mmorpg-core.com/forum/images/movingboxes.png[/URL]" alt="moving boxes" /> [COLOR=Yellow] <div id="slider"> <img class="scrollButtons left" src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/leftarrow.png"]http://www.mmorpg-core.com/forum/images/leftarrow.png[/URL]"> <div style="overflow: hidden;" class="scroll"> <div class="scrollContainer"> <div class="panel" id="panel_1"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/1.jpg"]http://www.mmorpg-core.com/forum/images/1.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/justbcuz/112479862/"]http://flickr.com/photos/justbcuz/112479862/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_2"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/2.jpg"]http://www.mmorpg-core.com/forum/images/2.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/joshuacraig/2698975899/"]http://flickr.com/photos/joshuacraig/2698975899/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_3"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/3.jpg"]http://www.mmorpg-core.com/forum/images/3.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/ruudvanleeuwen/468309897/"]http://flickr.com/photos/ruudvanleeuwen/468309897/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_4"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/4.jpg"]http://www.mmorpg-core.com/forum/images/4.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/emikohime/294092478/"]http://flickr.com/photos/emikohime/294092478/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_5"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/5.jpg"]http://www.mmorpg-core.com/forum/images/5.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/evilpeacock/1631808336/"]http://flickr.com/photos/evilpeacock/1631808336/[/URL]">more link</a></p> </div> </div> </div>[/COLOR] <div id="left-shadow"></div> <div id="right-shadow"></div> </div> <img class="scrollButtons right" src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/rightarrow.png"]http://www.mmorpg-core.com/forum/images/rightarrow.png[/URL]"> </div> <br /><br /> <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/moving-boxes/"]/moving-boxes/[/URL]" style="font-size: 16px; color: #900;">&lt; BACK TO ARTICLE</a> </div> </body> </html>
      Alles gelb Makierte brauchst du. Das passt du deinen Wünschen an.
      Für die Includierung des Javascripts musst du natürlich jQuery und diese Slideshow runterladen ;)

      P.S.: Warum geht der Code-Tag nicht richtig?
    • Kogoro;197748 schrieb:

      Dann stell die Fragen bitte nächstes Mal deutlicher.
      Such dir einfach eins aus. Meistens gibt es dann da Beispiele, aus welchen du den nötigen Quelltext extrahieren kannst.
      Beispiel: Moving Boxes
      Quellcode:

      HTML-Quellcode

      1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> <title>Moving Boxes</title> <link rel="stylesheet" href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/css/style.css"]css/style.css[/URL]" type="text/css" media="screen" charset="utf-8"> [COLOR=Yellow]<script src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/js/jquery-1.3.1.min.js"]js/jquery-1.3.1.min.js[/URL]" type="text/javascript" charset="utf-8"></script> <script src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/js/slider.js"]js/slider.js[/URL]" type="text/javascript" charset="utf-8"></script>[/COLOR] </head> <body> <style type="text/css"> .bsa_it_ad { border: 0 !important; padding: 6px !important; overflow: hidden !important; background: #eae3c0 !important; -moz-box-shadow: 0 0 48px black; -webkit-box-shadow: 0 0 48px black; } .bsa_it_ad a { margin: 0 !important; padding: 0 !important; } .bsa_it_ad a img { border: 0 !important; position: static !important; } .bsa_it_ad a:hover img { margin: 0 !important; } .bsa_it_ad a:hover { background: none !important; } .bsa_it_i { margin: 0 15px 0 0 !important; } .bsa_it_t { margin: 12px 0 0 0 !important; font: 16px Georgia, Serif !important; } .bsa_it_d { font: 11px Verdana, Helvetica, Arial, Sans-Serif; padding-right: 10px; } .bsa_it_p { bottom: 5px !important; right: 5px !important; padding: 0 !important; } .bsa_it_p a:hover { background: none !important; } .header-button { border-top: 1px solid #cf942d !important; border-bottom: 0 !important; background: #964418 !important; background: -webkit-gradient(linear, left top, left bottom, from(#e86e36), to(#964418)) !important; background: -moz-linear-gradient(top, #e86e36, #964418) !important; padding: 3px 10px !important; -webkit-border-radius: 8px !important; -moz-border-radius: 8px !important; border-radius: 8px !important; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0 !important; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0 !important; box-shadow: rgba(0,0,0,1) 0 1px 0 !important; text-shadow: rgba(0,0,0,.4) 0 1px 0 !important; color: white !important; font-size: 13px !important; font-family: Georgia, serif !important; text-decoration: none !important; vertical-align: middle !important; display: inline !important; margin: 0 !important; float: none !important; } .header-button:hover { border-top: 1px solid #4f220d !important; background: #4f220d !important; color: #ccc !important; text-decoration: none !important; margin: 0 !important; } .header-button:active { border-top: 1px solid #261105 !important; background: #261105; } .header-button:visited:before, .header-button:visited:after { content: "" !important; } </style> <div id="hook-just-in-case" style="height: 77px; background: black url(/examples/images/examples-header-bg.png) repeat-x; color: white !important; font: 14px Georgia, Serif !important; position: relative; zoom: 1; width: 100% !important; z-index: 10000 !important;"> <div style="width: 960px; height: 77px; margin: 0 auto; position: relative;"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/images/example-logo.png"]/examples/images/example-logo.png[/URL]" alt="Demo Page" style="position: absolute; top: 0; left: 0;" /> <div style="position: absolute; left: 140px; top: 52px; width: 400px; text-align: left;"> <a class="header-button" href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/"]http://css-tricks.com[/URL]">&larr; Back Home</a> &nbsp; <a class="header-button" href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/downloads/"]http://css-tricks.com/downloads/[/URL]">Other Demos &rarr;</a> </div> <div style="width: 420px; position: absolute; right: 0; top: 0;"> <div id="bsap_1248303" class="bsarocks bsap_3469a2a501a9e18091036aa0c89f9dcb"></div> </div> </div> </div> <div id="wrapper"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/movingboxes.png"]http://www.mmorpg-core.com/forum/images/movingboxes.png[/URL]" alt="moving boxes" /> [COLOR=Yellow] <div id="slider"> <img class="scrollButtons left" src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/leftarrow.png"]http://www.mmorpg-core.com/forum/images/leftarrow.png[/URL]"> <div style="overflow: hidden;" class="scroll"> <div class="scrollContainer"> <div class="panel" id="panel_1"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/1.jpg"]http://www.mmorpg-core.com/forum/images/1.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/justbcuz/112479862/"]http://flickr.com/photos/justbcuz/112479862/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_2"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/2.jpg"]http://www.mmorpg-core.com/forum/images/2.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/joshuacraig/2698975899/"]http://flickr.com/photos/joshuacraig/2698975899/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_3"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/3.jpg"]http://www.mmorpg-core.com/forum/images/3.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/ruudvanleeuwen/468309897/"]http://flickr.com/photos/ruudvanleeuwen/468309897/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_4"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/4.jpg"]http://www.mmorpg-core.com/forum/images/4.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/emikohime/294092478/"]http://flickr.com/photos/emikohime/294092478/[/URL]">more link</a></p> </div> </div> <div class="panel" id="panel_5"> <div class="inside"> <img src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/5.jpg"]http://www.mmorpg-core.com/forum/images/5.jpg[/URL]" alt="picture" /> <h2>News Heading</h2> <p>A very shot exerpt goes here... <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://flickr.com/photos/evilpeacock/1631808336/"]http://flickr.com/photos/evilpeacock/1631808336/[/URL]">more link</a></p> </div> </div> </div>[/COLOR] <div id="left-shadow"></div> <div id="right-shadow"></div> </div> <img class="scrollButtons right" src="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/examples/MovingBoxes/images/rightarrow.png"]http://www.mmorpg-core.com/forum/images/rightarrow.png[/URL]"> </div> <br /><br /> <a href="[URL="http://www.mmorpg-core.com/forum/view-source:http://css-tricks.com/moving-boxes/"]/moving-boxes/[/URL]" style="font-size: 16px; color: #900;">&lt; BACK TO ARTICLE</a> </div> </body> </html>
      Alles gelb Makierte brauchst du. Das passt du deinen Wünschen an.
      Für die Includierung des Javascripts musst du natürlich jQuery und diese Slideshow runterladen ;)

      P.S.: Warum geht der Code-Tag nicht richtig?





      ich danke dir mein lieber <3