---
title: "Bilder"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/191082-bilder"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "Heatseeker"
published: "2013-01-22T06:57:44.000Z"
updated: "2013-01-22T11:46:46.000Z"
replies: 7
views: 583
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/191082-bilder"
---

# Bilder

## #1 — Heatseeker, 2013-01-22T06:57Z

Har ytterligare problem med 3 bilder som jag kör till en slideshow.

HTML

```
<div id="wrap"> --har heigth:100%; till webläsaren--
<div id="content">

<ul id="slideshow">	 
<li><img src="img/img2.jpg" width="750" height="409" </li>
<li><img src="img/img1.jpg" width="750" height="409" /></li>
<li><img src="img/img3.jpg" width="750" height="409"  /></li>
</ul>

</div>
</div>
```

CSS

```
#slideshow{width:750px; height:409px; float:left; margin:10px 10px; overflow:hidden;
 position:absolute; z-index:0; list-style:none; padding:0;}
			
			

#slideshow ul{list-style:none; margin:0; padding:0;}
```

Jag skulle vilja att bilderna alltid är 100% till #slideshow. Så om jag minskar browsern så vill jag att bilderna ska minska även dom. 

jag vill att: 

```
 #content{width:100%;}
#slideshow{width:70%; height:40%;}
```

går det att lösa på något bra sätt genom att ändra nått i koden överst? Förklara gärna detaljrikt då jag inte är proffs på det här:)

Permalänk: https://www.webforum.nu/p/191082

## #2 — voigtann1, 2013-01-22T07:06Z

Det beror lite på hur din slideshow fungera idag, om det bara är bild 1 fade out =\> bild 2 fade in så är det ju inte något större problem att fixa det, men om det är som en karusell (bilder flyger från från sida till sida) så spontant så känns det som att man måste lösa det med JS för att positionera bilder mm du kan ju titta på zurbs orbit, den fungera ihop med deras responsiva grid: <http://foundation.zurb.com/docs/orbit.php>

Permalänk: https://www.webforum.nu/p/2307495

## #3 — Heatseeker, 2013-01-22T07:12Z

så här ser javascriptet ut som jag kör 

```
<script type="text/javascript">$(function () { $('#slideshow').cycle ({fx:'fade', speed: 2000, timeout: 4000,});});
</script>
```

Permalänk: https://www.webforum.nu/p/2307496

## #4 — Heatseeker, 2013-01-22T07:15Z

Och jag är till och med berädd att skippa fadeshown bara jag får till det här med bilden:)
Har du lust att förklra hur du tänker?

Permalänk: https://www.webforum.nu/p/2307498

## #5 — voigtann1, 2013-01-22T07:15Z

och vilket är cycle pluginet du använder dig av då(kan finnas flera plugin med samma namn)?

Permalänk: https://www.webforum.nu/p/2307497

## #6 — Heatseeker, 2013-01-22T07:16Z

jquery.cycle.all.js
jquery-1.8.3.js

Permalänk: https://www.webforum.nu/p/2307499

## #7 — voigtann1, 2013-01-22T07:21Z

Det säger inte mycket, är det <http://jquery.malsup.com/cycle/> du använder dig av? Länkar alltid till det plugin du använder dig av.

Sökte på jquery cycle och fick: <http://stackoverflow.com/questions/7003290/making-a-jquery-cycle-plugin-become-responsive-to-the-layout-pixels> (<http://www.bluebit.co.uk/blog/Using_jQuery_Cycle_in_a_Responsive_Layout>) kanske något för dig?

Permalänk: https://www.webforum.nu/p/2307500

## #8 — Heatseeker, 2013-01-22T11:46Z

Tack så mycket. Efter lite letande så hittade jag det jag behöver:)

Permalänk: https://www.webforum.nu/p/2307513

---

Tråden på webben: https://www.webforum.nu/amne/html-css/191082-bilder